Element-plus按需引入

简介: Element-plus按需引入

安装element-plus插件


npm install element-plus --save


安装配置文件


npm install babel-plugin-component -D


在项目根路径下配置babel.config.js文件


//babel.config.js
module.exports = {
  presets: [
    ['@babel/preset-env', { 'modules': false }]
  ],
  'plugins': [
    [
      'component',
      {
        'libraryName': 'element-plus',
        'styleLibraryName': 'theme-chalk'
      }
    ]
  ]
}


按需引入


import 'element-plus/lib/theme-chalk/index.css';
import { ElButton } from 'element-plus'
createApp(App).use(ElButton).mount('#app')


注意:我们不能在vite创建的vue3项目中使用按需引入,当引入样式文件后,会报错。


详细信息请访问element官网


相关文章
|
5月前
使用element clickoutside自定义指令事件,点击元素外部触发(element-ui/src/utils/clickoutside)
使用element clickoutside自定义指令事件,点击元素外部触发(element-ui/src/utils/clickoutside)
|
3天前
|
JavaScript
element组件问题
element组件问题
15 3
|
3月前
Element UI 按需引入(含CollapseTransition)
Element UI 按需引入(含CollapseTransition)
99 1
Vue3使用element-plus图标,局部引入写法
Vue3使用element-plus图标,局部引入写法
|
5月前
|
JavaScript 编译器
vue3引入element-plus完整步骤
vue3引入element-plus完整步骤
646 5
|
5月前
Element-UI结合脚手架之按需引入
Element-UI结合脚手架之按需引入
47 0
|
10月前
|
前端开发 JavaScript CDN
【 Element UI 】—Element UI 的基本使用
【 Element UI 】—Element UI 的基本使用
|
JavaScript API
Vue3 + Element-plus Tree 组件的 @check 事件使用方案
Vue3 + Element-plus Tree 组件的 @check 事件使用方案
658 0
element-ui中的prop 的相关作用
element-ui中的prop 的相关作用
443 0