diff --git a/package.json b/package.json index c4400692..e18bb338 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "postcss-html": "^1.4.1", "postcss-scss": "^4.0.4", "sass": "^1.52.1", - "stylelint": "^14.8.2", + "stylelint": "^14.8.3", "stylelint-config-recommended-scss": "^6.0.0", "stylelint-config-recommended-vue": "^1.4.0", "stylelint-config-standard": "^25.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5ea33aca..2992d6b2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,7 +11,7 @@ specifiers: '@vueuse/integrations': ^8.5.0 axios: ^0.27.2 dayjs: ^1.11.2 - element-plus: ^2.2.0 + element-plus: 2.2.0 eslint: ^8.16.0 eslint-plugin-vue: ^9.0.1 esno: ^0.16.3 @@ -33,7 +33,7 @@ specifiers: postcss-scss: ^4.0.4 qs: ^6.10.3 sass: ^1.52.1 - stylelint: ^14.8.2 + stylelint: ^14.8.3 stylelint-config-recommended-scss: ^6.0.0 stylelint-config-recommended-vue: ^1.4.0 stylelint-config-standard: ^25.0.0 @@ -53,7 +53,7 @@ specifiers: vite-plugin-svg-icons: ^2.0.1 vite-plugin-vue-layouts: ^0.6.0 vite-plugin-vue-setup-extend: ^0.4.0 - vue: 3.2.33 + vue: ^3.2.33 vue-eslint-parser: ^9.0.2 vue-router: ^4.0.15 @@ -95,11 +95,11 @@ devDependencies: postcss-html: 1.4.1 postcss-scss: 4.0.4 sass: 1.52.1 - stylelint: 14.8.2 - stylelint-config-recommended-scss: 6.0.0_stylelint@14.8.2 - stylelint-config-recommended-vue: 1.4.0_wdct7lrbpt3f5qukrrtdrzdofe - stylelint-config-standard: 25.0.0_stylelint@14.8.2 - stylelint-scss: 4.2.0_stylelint@14.8.2 + stylelint: 14.8.3 + stylelint-config-recommended-scss: 6.0.0_stylelint@14.8.3 + stylelint-config-recommended-vue: 1.4.0_qry3c7tpre6jvvuytvffjzlnpe + stylelint-config-standard: 25.0.0_stylelint@14.8.3 + stylelint-scss: 4.2.0_stylelint@14.8.3 svgo: 2.8.0 unplugin-auto-import: 0.7.2_4xyn6ao5ngwbgzbefoyccvabvi unplugin-vue-components: 0.19.5_vite@2.9.9+vue@3.2.33 @@ -1208,8 +1208,8 @@ packages: engines: {node: '>=8'} dev: true - /async-validator/4.0.7: - resolution: {integrity: sha512-Pj2IR7u8hmUEDOwB++su6baaRi+QvsgajuFB9j95foM1N2gy5HM4z60hfusIO0fBPG5uLAEl6yCJr1jNSVugEQ==} + /async-validator/4.1.1: + resolution: {integrity: sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA==} dev: false /async/0.9.2: @@ -2165,7 +2165,7 @@ packages: '@types/lodash': 4.14.182 '@types/lodash-es': 4.17.6 '@vueuse/core': 8.5.0_vue@3.2.33 - async-validator: 4.0.7 + async-validator: 4.1.1 dayjs: 1.11.2 escape-html: 1.0.3 lodash: 4.17.21 @@ -4758,10 +4758,6 @@ packages: engines: {node: '>=0.10.0'} dev: true - /normalize-selector/0.2.0: - resolution: {integrity: sha1-0LFF62kRicY6eNIB3E/bEpPvDAM=, tarball: normalize-selector/download/normalize-selector-0.2.0.tgz} - dev: true - /normalize-wheel-es/1.1.2: resolution: {integrity: sha512-scX83plWJXYH1J4+BhAuIHadROzxX0UBF3+HuZNY2Ks8BciE7tSTQ+5JhTsvzjaO0/EJdm4JBGrfObKxFf3Png==} dev: false @@ -6059,7 +6055,7 @@ packages: resolution: {integrity: sha1-eVjHk+R+MuB9K1yv5cC/jhLneQI=, tarball: style-search/download/style-search-0.1.0.tgz} dev: true - /stylelint-config-html/1.0.0_wdct7lrbpt3f5qukrrtdrzdofe: + /stylelint-config-html/1.0.0_qry3c7tpre6jvvuytvffjzlnpe: resolution: {integrity: sha1-FyrLmW7kyFToxnD8/3f/DZjTvsI=, tarball: stylelint-config-html/download/stylelint-config-html-1.0.0.tgz} engines: {node: ^12 || >=14} peerDependencies: @@ -6067,23 +6063,23 @@ packages: stylelint: '>=14.0.0' dependencies: postcss-html: 1.4.1 - stylelint: 14.8.2 + stylelint: 14.8.3 dev: true - /stylelint-config-recommended-scss/6.0.0_stylelint@14.8.2: + /stylelint-config-recommended-scss/6.0.0_stylelint@14.8.3: resolution: {integrity: sha512-6QOe2/OzXV2AP5FE12A7+qtKdZik7Saf42SMMl84ksVBBPpTdrV+9HaCbPYiRMiwELY9hXCVdH4wlJ+YJb5eig==} peerDependencies: stylelint: ^14.4.0 dependencies: postcss-scss: 4.0.4 - stylelint: 14.8.2 - stylelint-config-recommended: 7.0.0_stylelint@14.8.2 - stylelint-scss: 4.2.0_stylelint@14.8.2 + stylelint: 14.8.3 + stylelint-config-recommended: 7.0.0_stylelint@14.8.3 + stylelint-scss: 4.2.0_stylelint@14.8.3 transitivePeerDependencies: - postcss dev: true - /stylelint-config-recommended-vue/1.4.0_wdct7lrbpt3f5qukrrtdrzdofe: + /stylelint-config-recommended-vue/1.4.0_qry3c7tpre6jvvuytvffjzlnpe: resolution: {integrity: sha512-DVJqyX2KvMCn9U0+keL12r7xlsH26K4Vg8NrIZuq5MoF7g82DpMp326Om4E0Q+Il1o+bTHuUyejf2XAI0iD04Q==} engines: {node: ^12 || >=14} peerDependencies: @@ -6092,29 +6088,29 @@ packages: dependencies: postcss-html: 1.4.1 semver: 7.3.5 - stylelint: 14.8.2 - stylelint-config-html: 1.0.0_wdct7lrbpt3f5qukrrtdrzdofe - stylelint-config-recommended: 7.0.0_stylelint@14.8.2 + stylelint: 14.8.3 + stylelint-config-html: 1.0.0_qry3c7tpre6jvvuytvffjzlnpe + stylelint-config-recommended: 7.0.0_stylelint@14.8.3 dev: true - /stylelint-config-recommended/7.0.0_stylelint@14.8.2: + /stylelint-config-recommended/7.0.0_stylelint@14.8.3: resolution: {integrity: sha512-yGn84Bf/q41J4luis1AZ95gj0EQwRX8lWmGmBwkwBNSkpGSpl66XcPTulxGa/Z91aPoNGuIGBmFkcM1MejMo9Q==} peerDependencies: stylelint: ^14.4.0 dependencies: - stylelint: 14.8.2 + stylelint: 14.8.3 dev: true - /stylelint-config-standard/25.0.0_stylelint@14.8.2: + /stylelint-config-standard/25.0.0_stylelint@14.8.3: resolution: {integrity: sha512-21HnP3VSpaT1wFjFvv9VjvOGDtAviv47uTp3uFmzcN+3Lt+RYRv6oAplLaV51Kf792JSxJ6svCJh/G18E9VnCA==} peerDependencies: stylelint: ^14.4.0 dependencies: - stylelint: 14.8.2 - stylelint-config-recommended: 7.0.0_stylelint@14.8.2 + stylelint: 14.8.3 + stylelint-config-recommended: 7.0.0_stylelint@14.8.3 dev: true - /stylelint-scss/4.2.0_stylelint@14.8.2: + /stylelint-scss/4.2.0_stylelint@14.8.3: resolution: {integrity: sha512-HHHMVKJJ5RM9pPIbgJ/XA67h9H0407G68Rm69H4fzFbFkyDMcTV1Byep3qdze5+fJ3c0U7mJrbj6S0Fg072uZA==} peerDependencies: stylelint: ^14.5.1 @@ -6124,11 +6120,11 @@ packages: postcss-resolve-nested-selector: registry.nlark.com/postcss-resolve-nested-selector/0.1.1 postcss-selector-parser: registry.nlark.com/postcss-selector-parser/6.0.6 postcss-value-parser: registry.nlark.com/postcss-value-parser/4.1.0 - stylelint: 14.8.2 + stylelint: 14.8.3 dev: true - /stylelint/14.8.2: - resolution: {integrity: sha512-tjDfexCYfoPdl/xcDJ9Fv+Ko9cvzbDnmdiaqEn3ovXHXasi/hbkt5tSjsiReQ+ENqnz0eltaX/AOO+AlzVdcNA==} + /stylelint/14.8.3: + resolution: {integrity: sha512-aLpskXwSgFEBYbFRKA/BfuyYMGuXNtn2t5GqoffNPSezvw97x/vVNWcZNF0+cwt+LBjfvyq9/MRE3OjInGRgNA==} engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} hasBin: true dependencies: @@ -6155,7 +6151,6 @@ packages: meow: 9.0.0 micromatch: 4.0.5 normalize-path: 3.0.0 - normalize-selector: 0.2.0 picocolors: 1.0.0 postcss: 8.4.13 postcss-media-query-parser: 0.2.3 diff --git a/src/elementPlusServer.js b/src/elementPlusServer.js new file mode 100644 index 00000000..6c9e80db --- /dev/null +++ b/src/elementPlusServer.js @@ -0,0 +1,2 @@ +// 误删，该文件用于解决 element plus 在开发环境下按需引入导致页面频繁刷新的问题 +export default function importElementPlus() {} diff --git a/src/layout/components/SubSidebar/index.vue b/src/layout/components/SubSidebar/index.vue index a3a89f5e..a537a202 100644 --- a/src/layout/components/SubSidebar/index.vue +++ b/src/layout/components/SubSidebar/index.vue @@ -57,7 +57,7 @@ function onSidebarScroll(e) { bottom: 0; background-color: var(--g-sub-sidebar-bg); box-shadow: 10px 0 10px -10px var(--g-box-shadow-color); - transition: background-color 0.3s, var(--el-transition-box-shadow), left 0.3s; + transition: background-color 0.3s, var(--el-transition-box-shadow), left 0.3s, width 0.3s; &.is-collapse { width: 64px; .sidebar-logo { diff --git a/src/main.js b/src/main.js index efb4ba5a..10be4385 100644 --- a/src/main.js +++ b/src/main.js @@ -8,6 +8,9 @@ app.use(pinia) import router from './router' app.use(router) +import importElementPlus from '@/elementPlusServer' +importElementPlus(app) + import globalProperties from '@/util/global.properties' globalProperties(app) diff --git a/vite.config.js b/vite.config.js index 2c2e1862..d3b480cb 100644 --- a/vite.config.js +++ b/vite.config.js @@ -21,15 +21,6 @@ export default ({ mode, command }) => { scssResources.push(`@use "src/assets/sprites/_${dirname}.scss" as *;`) } }) - // BUG https://github.com/element-plus/element-plus/issues/4916 - const optimizeDepsElementPlusIncludes = ['element-plus/es'] - fs.readdirSync('node_modules/element-plus/es/components').map(dirname => { - fs.access(`node_modules/element-plus/es/components/${dirname}/style/css.mjs`, err => { - if (!err) { - optimizeDepsElementPlusIncludes.push(`element-plus/es/components/${dirname}/style/css`) - } - }) - }) return defineConfig({ base: './', // 开发服务器选项 https://cn.vitejs.dev/config/#server-options @@ -56,9 +47,34 @@ export default ({ mode, command }) => { } }, optimizeDeps: { - include: optimizeDepsElementPlusIncludes + include: [ + 'element-plus/es', + 'element-plus/es/components/message/style/css', + 'element-plus/es/components/notification/style/css', + 'element-plus/es/components/message-box/style/css' + ] }, - plugins: createVitePlugins(env, command === 'build'), + plugins: [ + ...createVitePlugins(env, command === 'build'), + // BUG https://github.com/antfu/unplugin-vue-components/issues/361 + { + name: 'dev-auto-import-element-plus', + transform(code, id) { + if (command === 'serve' && /src\/elementPlusServer.js$/.test(id)) { + return { + code: ` +import ElementPlus from 'element-plus'; +import 'element-plus/dist/index.css'; +export default function importElementPlus(app) { + app.use(ElementPlus); +} +`, + map: null + } + } + } + } + ], resolve: { alias: { '@': path.resolve(__dirname, 'src') diff --git a/vite/plugins/components.js b/vite/plugins/components.js index 0e2e47ee..bc0ed749 100644 --- a/vite/plugins/components.js +++ b/vite/plugins/components.js @@ -1,11 +1,11 @@ import components from 'unplugin-vue-components/vite' import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' -export default function createComponents() { +export default function createComponents(isBuild) { + const resolvers = [] + isBuild && resolvers.push(ElementPlusResolver()) return components({ - resolvers: [ - ElementPlusResolver() - ], + resolvers, dirs: ['src/components'], include: [/\.vue$/, /\.vue\?vue/, /\.jsx$/], dts: false diff --git a/vite/plugins/index.js b/vite/plugins/index.js index 53216720..7c10c0d8 100644 --- a/vite/plugins/index.js +++ b/vite/plugins/index.js @@ -20,7 +20,7 @@ export default function createVitePlugins(viteEnv, isBuild = false) { vitePlugins.push(createJsx()) vitePlugins.push(createHtml(viteEnv, isBuild)) vitePlugins.push(createAutoImport()) - vitePlugins.push(createComponents()) + vitePlugins.push(createComponents(isBuild)) vitePlugins.push(createSetupExtend()) vitePlugins.push(createSvgIcon(isBuild)) vitePlugins.push(createMock(viteEnv, isBuild))