先在需要放置脚手架文件的目录下cmd输入:vue init webpack vue-demo
然后在写一个简单的页面:分为两步
在components页面下写个.vue文件,分为三个部分:<template>,<script>,<style>
<template>
<div>
<h1>hello,你好,{{name}}</h1>
</div>
</template>
<script>
export default{
data(){
return{
name:"张三"
}
}
}
</script>
<style>
</style>
在router下index.js文件下面添加刚刚写的components对于的路由:(需要注意得导入对应文件的路径:import hello from '@/components/hello')
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import hello from '@/components/hello'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld
}
,
{
path: '/hello',
name: 'hello',
component: hello
}
]
})