rollup 如何按需引用或者说使用 element-ui ？

来源：15-6 【高能】组件库 async function 特性支持

希卡利

2020-11-09

我设置了

...
globals: { vue: 'Vue', 'element-ui': 'elementUi' }
...
external: ['vue', 'element-ui']

编译提示

(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
element-ui/lib/option (imported by src\components\Attrs\src\components\Screen.vue?rollup-plugin-vue=script.js)
element-ui/lib/select (imported by src\components\Attrs\src\components\Screen.vue?rollup-plugin-vue=script.js)
element-ui/lib/theme-chalk/select.css (imported by src\components\Attrs\src\components\Screen.vue?rollup-plugin-vue=script.js)
element-ui/lib/theme-chalk/option.css (imported by src\components\Attrs\src\components\Screen.vue?rollup-plugin-vue=script.js)
element-ui/lib/theme-chalk/base.css (imported by src\components\Attrs\src\components\Screen.vue?rollup-plugin-vue=script.js)
(!) Unused external imports
default imported from external module 'element-ui/lib/theme-chalk/select.css' but never used
default imported from external module 'element-ui/lib/theme-chalk/option.css' but never used
(!) Missing global variable names
Use output.globals to specify browser global variable names corresponding to external modules
element-ui/lib/option (guessing '_Option')
element-ui/lib/select (guessing '_Select')

使用

import { Select, Option } from 'element-ui'

写回答

2回答

穆桂英_俊主

2021-02-01

请问解决了吗？我也遇到同样的问题，不过这里引入的vue和element应该不是同一种插件，感觉这么引应该是不对，如果你解决了，可以分享一下吗？谢谢

穆桂英_俊主

我这边试了一下，不用再配置文件中配置elementui，直接npm安装-save-dev,然后在js中引入，在vue页面中直接使用就可以 ----------------------------------------------------- Search/index.js/ import Search from './search.vue' import Element from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' export default function(Vue) { Vue.component(Search.name, Search) Vue.use(Element) } --------------------------------------------------- Search/search.vue ---------------------------------------------------- src/index import Text from './components/Text1/index' import Text2 from './components/Text2/index' import Text3 from './components/Text3/index' import Search from './components/Search/index' export default function(Vue) { Vue.use(Text) Vue.use(Text2) Vue.use(Text3) Vue.use(Search) } ------------------------------------------------ build后在项目中seach组建button按钮使用成功正在尝试按需加载中

2021-02-01

共1条回复