使用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:表示仓库会忽略掉这些文件或者目录,不会提交到代码里面
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:项目的一些描述文件