UI组件–element-ui–全部引入和按需引入
主要就是一句话, 如果用到的组件少, 要按需引入, 如果用到的组件很多,就全部引入, 因为按需引入全部的, 和全部引入效果一样
完整引入
在 main.js 中写入以下内容:
1 | import Vue from 'vue'; |
以上代码便完成了 Element 的引入。需要注意的是,样式文件需要单独引入, 如果自定义主题, 则引入自定义主题.
按需引入
借助 babel-plugin-component,我们可以只引入需要的组件,以达到减小项目体积的目的。
首先,安装 babel-plugin-component:
1 | npm install babel-plugin-component -D |
然后,将 .babel.config.js修改为:
1 | { |
接下来,如果你只希望引入部分组件,比如 Button 和 Select,那么需要在 main.js 中写入以下内容:
1 | import Vue from 'vue'; |
完整组件列表和引入方式(完整组件列表以 components.json 为准)
1 | import Vue from 'vue'; |
- 本文作者: Raphael_Li
- 本文链接: https://lifei-2019.github.io/element-ui-1/
- 版权声明: 本博客所有文章除特别声明外,均采用 Apache License 2.0 许可协议。转载请注明出处!