深色模式
快速开始
环境说明
- vue 版本:
>3.4.0 - element-plus 版本:
>2.6.0
安装
shell
# NPM
npm i element-plus --save
npm i @easyui/element-plus-pro --save
# PNPM
pnpm add element-plus
pnpm add @easyui/element-plus-pro全量引入
js
import { createApp } from "vue";
import ElementPlus from "element-plus";
import ElementPlusPro from "@easyui/element-plus-pro";
import "element-plus/dist/index.css";
import "@easyui/element-plus-pro/theme/index.css";
import App from "./App.vue";
const app = createApp(App);
app.use(ElementPlus);
// 全量引入 ElementPlusPro 组件
app.use(ElementPlusPro);
app.mount("#app");按需引入
js
import { createApp } from "vue";
import ElementPlus from "element-plus";
import {
SSpace,
SLayout,
SLayoutMain,
SLayoutSide,
SFrame,
SFramePane,
SForm,
SFormItem,
SSearchForm,
SModalForm,
SList,
SListItem,
STable,
SSortTable,
SSortList,
SDynamicTable,
SDynamicList,
SModal,
SDrawer
} from "@easyui/element-plus-pro";
import "element-plus/dist/index.css";
import "@easyui/element-plus-pro/theme/index.css";
import App from "./App.vue";
const app = createApp(App);
app.use(ElementPlus);
// 按需引入 ElementPlusPro 组件
app.use(SSpace);
app.use(SLayout);
app.use(SLayoutMain);
app.use(SLayoutSide);
app.use(SFrame);
app.use(SFramePane);
app.use(SForm);
app.use(SFormItem);
app.use(SSearchForm);
app.use(SModalForm);
app.use(SList);
app.use(SListItem);
app.use(STable);
app.use(SSortTable);
app.use(SSortList);
app.use(SDynamicTable);
app.use(SDynamicList);
app.use(SModal);
app.use(SDrawer);
app.mount("#app");