可以按需引入吗

[Sayid1]

可以做按需引入吗 比如使用element-ui

[fingerpan]

这个分包机制是将明确知道需要引用的包进行预先打包。跟运行时主入口打包是完全分割开的打包机制。如果需要按需加载，你必须明确知道你需要的是什么，然后在写到打包入口中。你可以这样子做：

新建一个element.js 文件在你的项目中。 在这个例子中我将element.js放在与main.js同级

// 引入css
import 'element-ui/lib/theme-chalk/index.css'
// 你需要在这里加载你需要用到的组件
import  {Input} from 'element-ui'

const element = {

  install: function (Vue) {
    Vue.component(Input.name, Input)
  }
}
export default element

在你的入口文件引入这个文件并且注册， eg:

import element from './element.js'
Vue.use(element)

然后在vue.config.js中加上配置

// vue.config.js
module.exports = {
  // 其他配置..

  pluginOptions: {
    dll: {
      entry: {
        // 你新加的element.js文件路径
        index: ['./src/element.js'],
      }
    }
  },
}          

然后执行： npn run dll

注意点：

1. 在使用这个分包之前，你要确定好你已经按照elementUI做好按需加载的步骤，配置好babel-plugin-component
2. 每一次有element.js有改动，需要重新打包一次最新的。执行命令 npm run dll

[Sayid1]

如果是我想把vue和element-ui打包成两个vendor可以吗

[fingerpan]

可以。 你可以在配置文件中写两个入口。eg:

module.exports = {
  // Other options...

  pluginOptions: {
      dll: {
          // Multiple entry
          entry: {
            vendorNameOne: ['./src/element.js'],
            vendorNameTwo: ['vue'], 
         }
      }
   }
}

[Sayid1]

thanks