【vue】import的使用

如下是vue默認模板結構，自動加載HelloWorld

（1）@ 等價於 /src 這個目錄，避免寫麻煩又易錯的相對路徑，是在webpack.base.config.js裏面配置好別名

（2）import VueRouter1 from 'vue-router'  含義：將vue-router模塊中的對象賦值給VueRouter1變量

（3）import router2 from './router' 含義：將router目錄的對象賦值給router2變量

（4）router:router2, 因爲將變量名寫爲了router2，所以不能用簡寫模式，直接寫一個router

目錄結構:

index.js

import Vue from 'vue'
import VueRouter1 from 'vue-router' import HelloWorld from '@/components/HelloWorld'

Vue.use(VueRouter1)

export default new VueRouter1({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    }
  ]
})

main.js

import Vue from 'vue'
import App from './App' import router2 from './router'

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router:router2,
  components: { App },
  template: '<App/>'
})