方法一:传统引用
1.安装 element-ui
npm i element-ui -S
2.安装 babel-plugin-component
npm install babel-plugin-component -D
3.修改 babel.config.js(官网是说修改 .babelrc,实测新添加 .babelrc和直接修改 babel.config.js效果相同)
在vue原来生成的 babel.config.js的基础上做如下修改
{
"presets": "@vue/cli-plugin-babel/preset",
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
4.按需引入 Button 和 Message
import { Button, Message } from 'element-ui'
Vue.component(Button.name, Button)
// 或者 Vue.use(Button)
Vue.prototype.$message = Message
方法二:插件引用
可以通过 element 插件快速集成 element-ui
vue add element
选择第二项即可
小结:实际项目中还是推荐插件方法实现按需加载