Vue-cli创建的目录结构：

       Vue-cli可以快速的创建vue项目，可以方便的集成webpack工具，简化了开发流程。对于新手来说，vue的目录结构是必须要理解的。

       项目开发的文件都在src下面，与src平级的有一个index.html，其他的都是开发环境所需要的文件，不用过多的关注。打开index.html发现并没有script标签引用js文件，这是因为webpack这个工具在运行的时候会自动拷贝index.html在内存中，并在</body>前面加一个script标签并引入src->main.js文件。main.js中主要创建了一个new Vue实例，Vue实例中配置了el，data，component，router等。

       在main.js中引入了同级目录中的App.vue组件，并且挂载了组件。用template替换挂载元素的模板组件，挂载元素的内容都将被忽略。即用template替换index.html里面的<div id="app"></div>。所以说App.vue就是这个应用的主界面。

       App.vue里面放了一个<router-view/>这是一个路由占位符，是用来显示在main.js挂载的那个路由的。

       router目录下有一个index.js文件，使用来创建new Router()实例的，里面配置对应的路径和组件文件。

       组件文件都放在components文件夹下，供router和App.vue使用，是.vue的文件类型。