mcg-element-plus
介绍
使用 vue3+ts+vue-router@4+vite+rollup+element-plus 进行element-plus部分组件的二次封装，供自己学习使用，如有需求，可相互学习
安装使用
1、安装
npm install mcg-element-plus2、使用
前置安装：
npm install element-plus@1.1.0-beta.20 @element-plus/icons@0.0.11 --save
// main.ts 完整引入
import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'
// 引入图标
import * as Icons from '@element-plus/icons'
import { toLine } from './utils'
for (let i in Icons) {
// 注册全部图标组件
app.component(`el-icon-${toLine(i)}`, (Icons as any)[i])
}
const app = createApp(App)
app.use(ElementPlus)
app.mount('#app')toLine函数
// 把驼峰转换成横杠连接
export const toLine = (value: string) => {
return value.replace(/(A-Z)g/, '-$1').toLocaleLowerCase()
}全局引入
// main.ts
import mUI from 'mcg-element-plus'
import 'mcg-element-plus/dist/index.css'
app.use(mUI)在组件中使用
<template>
<m-choose-date></m-choose-date>
...其他组件
</template>按需引入
// main.ts
import chooseIcon from 'mcg-element-plus/chooseIcon'
import 'mcg-element-plus/chooseIcon/style.css'
app.use(chooseIcon)在组件中使用
<template>
<m-choose-icon></m-choose-icon>
</template>其他
- 在使用过程中有什么问题可以 issue 我