npm install element-plus
一丶main.js里配置:
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
// import ElementPlus from 'element-plus'
import "element-plus/dist/index.css";
import { components } from "./plugins/element";
const app = createApp(App);
for (const cpn of components) {
app.component(cpn.name, cpn);
}
app.use(store);
app.use(router);
// app.use(ElementPlus)
app.mount("#app");
二丶src下创建一个plugins文件夹,文件夹里创建一个element.ts文件 :
import {
ElButton,
ElTable,
ElAlert,
ElAside,
ElAutocomplete,
ElAvatar,
ElBacktop,
ElBadge,
} from "element-plus";
export const components = [
ElButton,
ElTable,
ElAlert,
ElAside,
ElAutocomplete,
ElAvatar,
ElBacktop,
ElBadge,
];
三丶组件内引入
<script>
import { defineComponent } from "vue";
import { ElButton } from "element-plus";
export default defineComponent({
name: "App",
components: {
ElButton,
},
});
</script>
四丶使用
<el-button type="danger">危险按钮</el-button>