vue2.0安装（中）

 

我们说道，如何利用脚手架（vue-cli）构建一个vue项目，本回书我们一起来学习分析下代码。

回顾下创建后的项目目录：

 

说明：在*.vue文件，template标签里写html代码，且template直接子级只能有一个标签。style标签里写样式，script里面写js代码

a. 页面：index.html

这个没什么好说的就是一个简单的html页面，这里id='app'，是为后面的设置vue作用域有关的。

b. 文件：Hello.vue

c. 文件：App.vue

  <router-view></router-view>   <!--  这里是用来展示路由页面内容的，如果想用跳转就用<router-link to='xxx'></router-link> -->

d. 文件：main.js

这个js文件是主页面配置的主入口。主要是利用es6的模块化引入模块。

e. 文件：index.js

这个是配置路由的页面

说明：如果需要增加组件那就在components文件下定义xx.vue文件并编写代码即可，如果需要配置路由就要进行在index.js进行路由“路径”配置，还需要点击跳转就要用到<router-link></router-link>标签了。