由于使用中太多坑,本人暂时放弃使用
碰见的坑 例如
#图标要加上 i-ep
<i-ep-House/>
# 在axios中使用加载和弹窗无效
开始使用配置正题
组件配置官网:快速开始 | Element Plus (gitee.io)
图标配置官网:Icon 图标 | Element Plus (gitee.io)
首先按需引入要安装如下
npm install -D unplugin-vue-components unplugin-auto-import
npm install -D unplugin-icons
然后vue项目中配置vue.config.js如下
const Icons = require('unplugin-icons/webpack')
const IconsResolver = require('unplugin-icons/resolver')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
module.exports = {
configureWebpack: {
plugins: [
AutoImport({
resolvers: [
ElementPlusResolver(),
// 自动导入图标组件
IconsResolver({
prefix: 'Icon'
})
]
}),
Components({
resolvers: [
// 自动注册图标组件
IconsResolver({
enabledCollections: ['ep']
}),
ElementPlusResolver()
]
}),
Icons({
autoInstall: true
})
]
}
}
以上就已经配置完成了!!!