vue router 導入方式
阿新 • • 發佈:2017-06-07
line 組件 tps con path outer 分塊 load https
時候才加載對應的組件,這樣就更加高效了。
vue router 的路由導入方式可用以下兩種:
一:直接導入
import Hello from ‘@/components/Hello‘@是在webpack.base.conf.js 配置:
resolve: { extensions: [‘.js‘, ‘.vue‘, ‘.json‘], alias: { ‘vue$‘: ‘vue/dist/vue.esm.js‘, [email protected]: resolve(‘src‘) } }二 :路由懶加載方式 當打包構建應用時,Javascript包會變得非常大,影響頁面加載,路由懶加載可以在路由被訪問的
const Foo = resolve =>{ require.ensure([‘./Foo.vue‘,() => { resolve(require(‘./Foo.vue‘)) }]) }這裏還有另一種代碼分塊的語法,使用 AMD 風格的 require,於是就更簡單了:
const Foo = resolve => require([‘./Foo.vue‘], resolve);之後的使用就跟之前是一樣的了
const router = new VueRouter({ routes: [ { path:參考:https://router.vuejs.org/zh-cn/advanced/lazy-loading.html‘/foo‘, component: Foo } ] })
vue router 導入方式