脚手架代码分离式管理解析

我这里以  main.js   文件为基础调用文件

我用   import xxx  from 'xxxx'的方式引入数据

在 vue 开发中 vue.js文件是所有设定基础 必须引入

import Vue from 'vue'

APP   引用的html页面展示的标签和css基础样式设定

import App from './App'

router 应用的是路由配置设定的文件

import router from './router'

我这里用的 webpac 打包方式 我用下面这句话     阻止启动生产消息

Vue.config.productionTip = false  

new Vue({

  el: '#app',

  router,

  components: { App },

  template: '<App/>'

})

router文件中代码

import VueRouter from 'vue-router'

import Vue from 'vue'

import temp1 from '@/components/HelloWorld'

Vue.use(VueRouter)

这里Vue.use(VueRouter)是启动router路由

我为其这样设定返回色划定的数据

为其这样设定来做一些路有变化的设定

html中我们用router-link标签来设定路由的跳转和一些设定  我们用to属性来设定路由的改变 router-view标来展示数据

用这样的方式返回设定的html代码

这样设定只在此页面css样式可以用

'use strict'  严格模式下开发