From fea323cff18b80b0c9dbee72b7ffc85cd3f14bdf Mon Sep 17 00:00:00 2001 From: vben Date: Sat, 1 Apr 2023 23:53:26 +0800 Subject: [PATCH] chore: css is no longer imported on demand --- README.md | 1 - README.zh-CN.md | 1 - build/vite/plugin/imagemin.ts | 34 ------------- build/vite/plugin/index.ts | 5 -- build/vite/plugin/styleImport.ts | 83 -------------------------------- package.json | 2 - src/main.ts | 7 +-- 7 files changed, 1 insertion(+), 132 deletions(-) delete mode 100644 build/vite/plugin/imagemin.ts delete mode 100644 build/vite/plugin/styleImport.ts diff --git a/README.md b/README.md index 249072429..c6f81366b 100644 --- a/README.md +++ b/README.md @@ -131,7 +131,6 @@ If these plugins are helpful to you, you can give a star support - [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - Used for local and development environment data mock - [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - Used for html template conversion and compression -- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - Used for component library style introduction on demand - [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - Used for online switching of theme colors and other color-related configurations - [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - Used to pack input .gz|.brotil files - [vite-plugin-svg-icons](https://github.com/anncwb/vite-plugin-svg-icons) - Used to quickly generate svg sprite diff --git a/README.zh-CN.md b/README.zh-CN.md index 4a111576c..f1baef657 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -141,7 +141,6 @@ pnpm build - [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - 用于本地及开发环境数据 mock - [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - 用于 html 模版转换及压缩 -- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - 用于组件库样式按需引入 - [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - 用于在线切换主题色等颜色相关配置 - [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - 用于打包输出.gz|.brotil 文件 - [vite-plugin-svg-icons](https://github.com/anncwb/vite-plugin-svg-icons) - 用于快速生成 svg 雪碧图 diff --git a/build/vite/plugin/imagemin.ts b/build/vite/plugin/imagemin.ts deleted file mode 100644 index a0235732e..000000000 --- a/build/vite/plugin/imagemin.ts +++ /dev/null @@ -1,34 +0,0 @@ -// Image resource files used to compress the output of the production environment -// https://github.com/anncwb/vite-plugin-imagemin -import viteImagemin from 'vite-plugin-imagemin'; - -export function configImageminPlugin() { - const plugin = viteImagemin({ - gifsicle: { - optimizationLevel: 7, - interlaced: false, - }, - optipng: { - optimizationLevel: 7, - }, - mozjpeg: { - quality: 20, - }, - pngquant: { - quality: [0.8, 0.9], - speed: 4, - }, - svgo: { - plugins: [ - { - name: 'removeViewBox', - }, - { - name: 'removeEmptyAttrs', - active: false, - }, - ], - }, - }); - return plugin; -} diff --git a/build/vite/plugin/index.ts b/build/vite/plugin/index.ts index 7051e0cc2..c2c9a5d6e 100644 --- a/build/vite/plugin/index.ts +++ b/build/vite/plugin/index.ts @@ -4,12 +4,10 @@ import vueJsx from '@vitejs/plugin-vue-jsx'; import purgeIcons from 'vite-plugin-purge-icons'; import windiCSS from 'vite-plugin-windicss'; import VitePluginCertificate from 'vite-plugin-mkcert'; -//import vueSetupExtend from 'vite-plugin-vue-setup-extend'; import { configHtmlPlugin } from './html'; import { configPwaConfig } from './pwa'; import { configMockPlugin } from './mock'; import { configCompressPlugin } from './compress'; -import { configStyleImportPlugin } from './styleImport'; import { configVisualizerConfig } from './visualizer'; import { configThemePlugin } from './theme'; import { configSvgIconsPlugin } from './svgSprite'; @@ -44,9 +42,6 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) { // vite-plugin-purge-icons vitePlugins.push(purgeIcons()); - // vite-plugin-style-import - vitePlugins.push(configStyleImportPlugin(isBuild)); - // rollup-plugin-visualizer vitePlugins.push(configVisualizerConfig()); diff --git a/build/vite/plugin/styleImport.ts b/build/vite/plugin/styleImport.ts deleted file mode 100644 index 6e152b7b8..000000000 --- a/build/vite/plugin/styleImport.ts +++ /dev/null @@ -1,83 +0,0 @@ -/** - * Introduces component library styles on demand. - * https://github.com/anncwb/vite-plugin-style-import - */ -import { createStyleImportPlugin, VxeTableResolve } from 'vite-plugin-style-import'; - -export function configStyleImportPlugin(_isBuild: boolean) { - if (!_isBuild) { - return []; - } - const styleImportPlugin = createStyleImportPlugin({ - libs: [ - { - libraryName: 'ant-design-vue', - esModule: true, - resolveStyle: (name) => { - // 这里是无需额外引入样式文件的“子组件”列表 - const ignoreList = [ - 'anchor-link', - 'sub-menu', - 'menu-item', - 'menu-divider', - 'menu-item-group', - 'breadcrumb-item', - 'breadcrumb-separator', - 'form-item', - 'step', - 'select-option', - 'select-opt-group', - 'card-grid', - 'card-meta', - 'collapse-panel', - 'descriptions-item', - 'list-item', - 'list-item-meta', - 'table-column', - 'table-column-group', - 'tab-pane', - 'tab-content', - 'timeline-item', - 'tree-node', - 'skeleton-input', - 'skeleton-avatar', - 'skeleton-title', - 'skeleton-paragraph', - 'skeleton-image', - 'skeleton-button', - ]; - // 这里是需要额外引入样式的子组件列表 - // 单独引入子组件时需引入组件样式，否则会在打包后导致子组件样式丢失 - const replaceList = { - textarea: 'input', - 'typography-text': 'typography', - 'typography-title': 'typography', - 'typography-paragraph': 'typography', - 'typography-link': 'typography', - 'dropdown-button': 'dropdown', - 'input-password': 'input', - 'input-search': 'input', - 'input-group': 'input', - 'radio-group': 'radio', - 'checkbox-group': 'checkbox', - 'layout-sider': 'layout', - 'layout-content': 'layout', - 'layout-footer': 'layout', - 'layout-header': 'layout', - 'month-picker': 'date-picker', - 'range-picker': 'date-picker', - 'image-preview-group': 'image', - }; - - return ignoreList.includes(name) - ? '' - : replaceList.hasOwnProperty(name) - ? `ant-design-vue/es/${replaceList[name]}/style/index` - : `ant-design-vue/es/${name}/style/index`; - }, - }, - ], - resolves: [VxeTableResolve()], - }); - return styleImportPlugin; -} diff --git a/package.json b/package.json index f2d0dfa11..594f143c6 100644 --- a/package.json +++ b/package.json @@ -180,10 +180,8 @@ "vite-plugin-mock": "^2.9.6", "vite-plugin-purge-icons": "^0.8.1", "vite-plugin-pwa": "^0.11.13", - "vite-plugin-style-import": "^2.0.0", "vite-plugin-svg-icons": "^2.0.1", "vite-plugin-theme": "^0.8.6", - "vite-plugin-vue-setup-extend": "^0.4.0", "vite-plugin-windicss": "^1.8.4", "vue-eslint-parser": "^8.3.0", "vue-tsc": "^1.0.9" diff --git a/src/main.ts b/src/main.ts index 5cdb842b2..50b0d94eb 100644 --- a/src/main.ts +++ b/src/main.ts @@ -3,6 +3,7 @@ import 'virtual:windi-components.css'; import '/@/design/index.less'; import '/@/components/VxeTable/src/css/index.scss'; import 'virtual:windi-utilities.css'; +import 'ant-design-vue/dist/antd.css'; // Register icon sprite import 'virtual:svg-icons-register'; import App from './App.vue'; @@ -16,12 +17,6 @@ import { setupGlobDirectives } from '/@/directives'; import { setupI18n } from '/@/locales/setupI18n'; import { registerGlobComp } from '/@/components/registerGlobComp'; -import { isDevMode } from './utils/env'; - -if (isDevMode()) { - import('ant-design-vue/es/style'); -} - async function bootstrap() { const app = createApp(App);