main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import routes from './router/'
import store from './store/'
import './config/flexible'
Vue.use(VueRouter)
const router = new VueRouter({
routes,
mode: 'history',
strict: process.env.NODE_ENV !== 'production'
})
new Vue({
el: '#app',
router,
store
})
router
import App from '../App'
const home = r => require.ensure([], () => r(require('@/components/home/home')), 'home')
export default [{
path: '/',
component: App,
children: [
{
path: '',
redirect: '/home'
},
{
path: '/home',
component: home
}
]
}]
App.vue
<template>
<div class="main">
<router-view></router-view>
</div>
</template>
<script>
export default {
}
</script>
<style lang="scss">
@import './style/common';
</style>
home.vue
<template>
<div class="hello">
<h1>{{ msg }}</h1>
</div>
</template>
<script>
export default {
name: 'hello',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<style scoped lang="scss">
</style>
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…