vue-vue-cli2目录结构介绍

　　在使用vue-cli2初始化项目后，会出现如下的一个目录结构：

 　　下面依次简单简述下各目录和文件的作用：

　　　　build：webpack的配置，但这里主要是插件、项目运行相关的配置

　　　　config：也是webpack的配置，但不同是他主要是配置一些变量。和springboot的application.yml类似

　　　　node_modules：依赖保存的地方

　　　　src：写代码的地方

　　　　static：静态资源存放的地方，比如html,css等等，不过像图片的话是放在src/assets目录下的

　　　　.babelrc：babel的配置文件；babel是能将ES6转化成ES5的工具

　　　　.editorconfiig：文本配置，也就是像文本代码，如html,css,js等使用的编码，缩进格式，换行符的配置

　　　　.eslintignore：eslint是用来约束代码规范的，该代码也就是说哪些文件是不需要约束的，忽视掉

　　　　.eslintrc：eslint的配置文件

　　　　.gitigore：在上传到github时，哪些文件不需要上传

　　　　index.html：项目的入口页面

　　　　package.json：配置项目的基本信息和依赖的大概版本，这里强调一下，该文件的依赖版本只是指定大概的范围，具体真是下载的版本以package-lock.json为主

　　　　package-lock.json：记录node_modules依赖的真是版本

　　　　README.md：项目的说明书这样子

　　上面的目录结构说完了，也顺便拓展下其他东西，我们看到cli2生成的package.json中的脚本：

 　　主要是dev和bulid这2个脚本：

　　dev：是在开发时启动项目使用的脚本，一般都会使用webpack-dev-server作为本地服务器来热加载，方便测试

　　build：打包项目到dist，但我们仔细看，cli2这使用的是node命令去执行 build文件夹下的build.js来打包；在没学习node前，我们对JS的印象是，它得在html中进行引入使用，最终在浏览器才能进行执行。好像从来没有独立运行过JS文件吧？

　　不过像其他编程语言，比如Java，C....他们是可以独立运行的，但JS不行。但后来就有人用C++开发node，里面用到V8引擎，这样就能对JS文件解析并执行了，因此我们通常说node是JS的运行环境或服务器，就是因为他能独立执行JS文件。

　　然后再来看项目目录下的index.html：

 

 　　代码是十分简洁的，一般我们不会去改这个文件

　　还有Vue实例，通常是在src的main.js来写的：

 

 　　也要记住，通常这个Vue实例也不会去动他，index.html最终页面的展示是交付给App.vue来展示的，Vue实例相当根组件，App.vue是他的子组件，但对于很多来讲，App.vue是入口组件，也可以这么说啦，仁者见仁，智者见智！