第一种:使用vue add element 脚手架自动搭建按需导入(自动实现第二种)
第二种:手动按需导入
1.使用npm安装element-ui
npm i element-ui -S
2.安装 babel-plugin-component
npm install babel-plugin-component -D
3.将babel.config.js修改为:
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset' //跟官网的不同
],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
4.创建plugins/element.js文件,按需引入/注册部分组件
//element.js
import Vue from 'vue';
import { Button,Form} from 'element-ui';
Vue.use(Button)
Vue.use(Form)
5.在main.js中添加element的依赖
// main.js
import './plugins/element.js'
6.使用element组件
//any component
<el-button></el-button>