使用vue-cli创建的工程的相关文件介绍

1、使用vue-cli安装的项目的整个文件如下图所示：下面介绍一级目录的文件夹的作用

sell2是项目名；一级目录下的文件夹名build和config都是和webpack配置相关的；文件夹node_modules是通过npm install安装的依赖代码库；文件夹src用来存放项目源码，即开发的代码都放在src文件夹下；文件夹static存放第三方静态资源的，只有一个.gitkeep文件，这个文件的作用是当这个目录为空，也可以把这个目录提交到git代码仓库里。

2、下面看一下一级目录下的文件的作用

A、.babelrc：是babel的一些配置，代码是es6书写的，大部分的浏览器不能直接支持es6语法，所以通过babel将es6编译成es5，下图是.babelrc文件里面的内容：

"presets"：表示预设

B、.editorconfig：表示编辑器的一些配置，如下图所示

C、.eslintignore：文件内容显示如下，不会对build和config文件夹下的内容做es语法检查

D、.eslintrc.js：是对eslint的一些配置

E、.gitignore：表示仓库会忽略掉这些文件或者目录，不会将代码提交到线上的仓库里面去

在项目的根目录 下会有static文件夹名，用于存放静态资源，前端做的一些假设静态数据一般放在这里，比如static/mock/index.json

当把代码提交到仓库的时候，不把这个静态的资源文件夹mock内容提交，则在.gitignore文件添加如下内容：

 

F、index.html就是我们的入口html文件，如下图所示

在这个文件里面没有依赖任何css或者js文件，这是因为在webpack编译时自动会插入到这个html文件里面

G、package.json：项目的配置文件，一般是用来描述一个项目，如下图所示

注意：该文件里面不能有注释，否则会出现下面的错误提示：Failed to parse json; Unexpected token '/' at 12:20 "dependecies":{//jkdj。其中Unexpected token '/' 就表明错误的原因，这句话"dependecies":{//jkdj就表明出错的地方。这里是因为有注释所以才报错，将注释去掉就可以了。

H、README.md：项目的一些描述文件