diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index e80a4c008fb2e1708d1db250d702f94b4d1a6e51..e606ee802dfb95f731920c0dd5cd97495cac5d27 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -4,6 +4,10 @@
- 新增 `SimpleMenu`组件替代左侧菜单组件(顶部菜单没有替换,功能尽量做到简单不卡)。解决菜单卡顿问题。
+### ✨ Features
+
+- `css` 按需引入
+
### 🐛 Bug Fixes
- 修复 `TableAction`图标问题
diff --git a/build/vite/plugin/index.ts b/build/vite/plugin/index.ts
index fd09058681357e0cd8061a62b329fba61b0a9a0a..c75fe8f3eeab491fcd063b6279d26d5fc1aeb67f 100644
--- a/build/vite/plugin/index.ts
+++ b/build/vite/plugin/index.ts
@@ -11,6 +11,7 @@ import { configHtmlPlugin } from './html';
import { configPwaConfig } from './pwa';
import { configMockPlugin } from './mock';
import { configGzipPlugin } from './gzip';
+import { configStyleImportConfig } from './style-import';
// gen vite plugins
export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean, mode: string) {
@@ -28,6 +29,9 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean, mode: stri
// vite-plugin-purge-icons
vitePlugins.push(PurgeIcons());
+ // vite-plugin-style-import
+ vitePlugins.push(configStyleImportConfig());
+
// rollup-plugin-gzip
vitePlugins.push(configGzipPlugin(isBuild));
diff --git a/build/vite/plugin/style-import.ts b/build/vite/plugin/style-import.ts
new file mode 100644
index 0000000000000000000000000000000000000000..03753a9eae073097bce6a85a7a15f266d71f6482
--- /dev/null
+++ b/build/vite/plugin/style-import.ts
@@ -0,0 +1,27 @@
+import styleImport from 'vite-plugin-style-import';
+
+export function configStyleImportConfig() {
+ const pwaPlugin = styleImport({
+ libs: [
+ {
+ libraryName: 'ant-design-vue',
+ resolveStyle: (name) => {
+ // ! col row popconfirm These three components have no corresponding css files after packaging. Need special treatment
+
+ if (['col', 'row'].includes(name)) {
+ return 'ant-design-vue/lib/grid/style/index.css';
+ }
+
+ if (['popconfirm'].includes(name)) {
+ return [
+ 'ant-design-vue/lib/popover/style/index.css',
+ 'ant-design-vue/lib/button/style/index.css',
+ ];
+ }
+ return `ant-design-vue/lib/${name}/style/index.css`;
+ },
+ },
+ ],
+ });
+ return pwaPlugin;
+}
diff --git a/package.json b/package.json
index cdf956157b0cde2f46f35d1d67fe203dd265a505..595c6f8780406bdcdc02faac6dfd84a5c2f4c9dc 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,7 @@
"scripts": {
"bootstrap": "yarn install",
"serve": "vite",
+ "dev": "vite",
"build": "vite build && esno ./build/script/postBuild.ts",
"build:no-cache": "yarn clean:cache && npm run build",
"report": "cross-env REPORT=true npm run build ",
@@ -12,6 +13,7 @@
"log": "conventional-changelog -p custom-config -i CHANGELOG.md -s -r 0",
"clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite_opt_cache",
"clean:lib": "npx rimraf node_modules",
+ "typecheck": "vuedx-typecheck .",
"lint:eslint": "eslint --fix --ext \"src/**/*.{vue,less,css,scss}\"",
"lint:prettier": "prettier --write --loglevel warn \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
"lint:stylelint": "stylelint --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
@@ -32,7 +34,7 @@
"path-to-regexp": "^6.2.0",
"qrcode": "^1.4.4",
"sortablejs": "^1.13.0",
- "vditor": "^3.7.5",
+ "vditor": "^3.7.6",
"vue": "^3.0.5",
"vue-i18n": "^9.0.0-rc.2",
"vue-router": "^4.0.3",
@@ -66,8 +68,8 @@
"@vitejs/plugin-vue": "^1.0.6",
"@vitejs/plugin-vue-jsx": "^1.0.2",
"@vue/compiler-sfc": "^3.0.5",
- "@vuedx/typecheck": "^0.5.0",
- "@vuedx/typescript-plugin-vue": "^0.5.0",
+ "@vuedx/typecheck": "^0.6.0",
+ "@vuedx/typescript-plugin-vue": "^0.6.0",
"autoprefixer": "^10.2.1",
"commitizen": "^4.2.3",
"conventional-changelog-cli": "^2.1.1",
@@ -101,6 +103,7 @@
"vite-plugin-mock": "^2.0.0-beta.3",
"vite-plugin-purge-icons": "^0.5.1",
"vite-plugin-pwa": "^0.3.8",
+ "vite-plugin-style-import": "^0.2.1",
"vue-eslint-parser": "^7.3.0",
"yargs": "^16.2.0"
},
diff --git a/src/components/registerGlobComp.ts b/src/components/registerGlobComp.ts
index cd3956767a6319862c43d8086240a3012caad567..6268b659241ee2e6c1f1157c6ecbc9678663ff82 100644
--- a/src/components/registerGlobComp.ts
+++ b/src/components/registerGlobComp.ts
@@ -40,7 +40,7 @@ import {
Col,
Spin,
} from 'ant-design-vue';
-import 'ant-design-vue/dist/antd.css';
+// import 'ant-design-vue/dist/antd.css';
import { App } from 'vue';
diff --git a/src/views/demo/page/form/basic/index.vue b/src/views/demo/page/form/basic/index.vue
index 731ed3368f3cfeca47ca0fdbb50ffeb3fa0e5387..ccc61a49055614ceba505f7faa95b1ffe04c627d 100644
--- a/src/views/demo/page/form/basic/index.vue
+++ b/src/views/demo/page/form/basic/index.vue
@@ -3,6 +3,7 @@
title="基础表单"
contentBackground
content=" 表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。"
+ contentClass="p-4"
>
diff --git a/src/views/demo/page/form/high/index.vue b/src/views/demo/page/form/high/index.vue
index 88d73c81d83570a5c140a078d8a6cec479c9b0b0..fc01a2564a45d8e48b259f41a764d061faaddae1 100644
--- a/src/views/demo/page/form/high/index.vue
+++ b/src/views/demo/page/form/high/index.vue
@@ -4,6 +4,7 @@
title="高级表单"
contentBackground
content=" 高级表单常见于一次性输入和提交大批量数据的场景。"
+ contentClass="p-4"
>
diff --git a/src/views/demo/page/form/step/index.vue b/src/views/demo/page/form/step/index.vue
index 8820af1e8cc01405caf4cd30714e2e829b0224a7..98a4424d118abf1da89ebbf41c4964594d1961b1 100644
--- a/src/views/demo/page/form/step/index.vue
+++ b/src/views/demo/page/form/step/index.vue
@@ -3,6 +3,7 @@
title="分步表单"
contentBackground
content=" 将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。"
+ contentClass="p-4"
>