首页 文章

Vue 2 - 按需导入

提问于
浏览
0
import Vue from 'vue'

import { 
         Button, 
         Select,
         Table,
         Form, 
        } from 'element-ui'


import App from './App.vue'

Vue.component(Button.name, Button)
Vue.component(Select.name, Select)

// Used by admin section of the website
Vue.component(Table.name, Table)
Vue.component(Form.name, Form)

const routes = [
    { path: '/', component: Home },
    { path: '/admin', meta: { requiresAuth: true }, component: Admin},
];

new Vue({
  el: '#app',
  render: h => h(App)
})

我正在为每个人使用组件按钮和选择,但我只在管理页面中使用表格和表格 . admin部分是包含其他组件的Vue组件 .

这是个问题 . 由于我想通过Webpack优化捆绑构建的大小,我怎么能默认导入导入按钮和选择,但只要你到达管理部分就可以导入表格和表格?

我想我需要在Webpack中拥有多个块,但我不知道该怎么做 .

谢谢

2 回答

  • 1

    您're right, you' ll需要将您的文件分成几个文件 . 你应该看一下single files component .

    这样,您就可以在组件级别管理依赖项 .

    如果你对通行费感觉更加舒适,可以自动配置(几乎)一切,vue-cli是你需要的工具 .

  • 0

    我刚刚在Vue Router文档中错过了它

    const Foo = resolve => {
      // require.ensure is Webpack's special syntax for a code-split point.
      require.ensure(['./Foo.vue'], () => {
        resolve(require('./Foo.vue'))
      })
    }
    

相关问题