vue/cli的目录结构说明

node_modules:npm 加载的项目所需要的各种依赖模块。

src:这里是我们开发的主要目录(源码),基本上要做的事情都在这个目录里面,里面包含了几个目录及文件:

  1、assets:放置一些图片(会根据图片大小分类进行base64命名还是其他方式命名),如logo等;

  2、components:目录里放的是一个个的组件文件;

  3、App.vue:项目入口组件(跟组件),我们也可以将组件写这里,而不使用components目录。主要作用就是将我们自己定义的组件通过它与页面建立联系进行渲染,这里面的<router-view/>必不可少。

  4、main.js :项目的核心文件(整个项目的入口js)引入依赖包、默认页面样式等(项目运行后会在index.html中形成一个app.js文件)。

  5、router/index.js:配置路由的地方

static:静态资源目录(会原分不动的对文件进行处理),如图片、字体等。

build:最终发布的代码的存放位置。

config:配置路径、端口号等一些信息,我们刚开始学习的时候选择默认配置。

test:初始测试目录,可删除

package.json:项目配置信息文件/所依赖的开发包的版本信息及所依赖的插件信息。(大概版本)

package-lock.json:项目配置信息文件/所依赖的开发包的版本信息及所依赖的插件信息。(具体版本)

README.md:项目的说明文件。

webpack.config.js:webpack的配置文件,例:把.vue的文件打包成浏览器能读懂的文件。

.babelrc:是检测es6语法的配置文件,例:适配哪些浏览器的限制

.gitignore:上传到服务器忽略哪些文件的配置(比如模拟本地数据mock不让他在get提交/打包上线的时候忽略不使用可在这里配置)

.postcssrc.js:前缀的配置 (css转化的配置)

.editorconfig:对代码进行规范,例:root是否进行检测,代码尾部是否换行,缩行前面几个空格...(建议定义这个规范)

.eslintrc.js:配置eslint语法规则(在这里面的rules属性中配置让哪个语法规则失效)

.eslintignore:忽略eslint对项目某些文件的语法规则的检查

posted @ 2022-02-10 17:28  干了这瓶老干妈  阅读(337)  评论(0编辑  收藏  举报
Live2D