From 5af5ffb7b23ad7d004450b1438d66532dc91e416 Mon Sep 17 00:00:00 2001 From: June <1601745371@qq.com> Date: Wed, 21 Aug 2024 13:26:19 +0800 Subject: [PATCH] =?UTF-8?q?:hammer:=20refactor:=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E8=84=9A=E6=89=8B=E6=9E=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build/optimize.ts | 97 +++++++++++++++++++++++++++++++++++++++++ build/plugins.ts | 107 ++++++++++++++++++++++++++++++++++++++++++++++ typings/env.d.ts | 10 +++++ vite.config.mts | 81 +++-------------------------------- 4 files changed, 219 insertions(+), 76 deletions(-) create mode 100644 build/optimize.ts create mode 100644 build/plugins.ts diff --git a/build/optimize.ts b/build/optimize.ts new file mode 100644 index 0000000..9c0353d --- /dev/null +++ b/build/optimize.ts @@ -0,0 +1,97 @@ +/* + * @Description: + * @Author: June + * @Date: 2024-08-21 13:15:34 + * @LastEditTime: 2024-08-21 13:15:52 + * @LastEditors: June + */ +const include = [ + 'vue', + 'sass', + 'axios', + 'dayjs', + 'unocss', + 'vue-router', + 'vue-i18n', + 'lodash-es', + 'element-plus', + 'element-plus/es', + 'element-plus/es/locale/lang/zh-cn', + 'element-plus/es/locale/lang/en', + 'element-plus/es/components/backtop/style/css', + 'element-plus/es/components/form/style/css', + 'element-plus/es/components/radio-group/style/css', + 'element-plus/es/components/radio/style/css', + 'element-plus/es/components/checkbox/style/css', + 'element-plus/es/components/checkbox-group/style/css', + 'element-plus/es/components/switch/style/css', + 'element-plus/es/components/time-picker/style/css', + 'element-plus/es/components/date-picker/style/css', + 'element-plus/es/components/descriptions/style/css', + 'element-plus/es/components/descriptions-item/style/css', + 'element-plus/es/components/link/style/css', + 'element-plus/es/components/tooltip/style/css', + 'element-plus/es/components/drawer/style/css', + 'element-plus/es/components/dialog/style/css', + 'element-plus/es/components/checkbox-button/style/css', + 'element-plus/es/components/option-group/style/css', + 'element-plus/es/components/radio-button/style/css', + 'element-plus/es/components/cascader/style/css', + 'element-plus/es/components/color-picker/style/css', + 'element-plus/es/components/input-number/style/css', + 'element-plus/es/components/rate/style/css', + 'element-plus/es/components/select-v2/style/css', + 'element-plus/es/components/tree-select/style/css', + 'element-plus/es/components/slider/style/css', + 'element-plus/es/components/time-select/style/css', + 'element-plus/es/components/autocomplete/style/css', + 'element-plus/es/components/image-viewer/style/css', + 'element-plus/es/components/upload/style/css', + 'element-plus/es/components/col/style/css', + 'element-plus/es/components/form-item/style/css', + 'element-plus/es/components/alert/style/css', + 'element-plus/es/components/breadcrumb/style/css', + 'element-plus/es/components/select/style/css', + 'element-plus/es/components/input/style/css', + 'element-plus/es/components/breadcrumb-item/style/css', + 'element-plus/es/components/tag/style/css', + 'element-plus/es/components/pagination/style/css', + 'element-plus/es/components/table/style/css', + 'element-plus/es/components/table-v2/style/css', + 'element-plus/es/components/table-column/style/css', + 'element-plus/es/components/card/style/css', + 'element-plus/es/components/row/style/css', + 'element-plus/es/components/button/style/css', + 'element-plus/es/components/menu/style/css', + 'element-plus/es/components/sub-menu/style/css', + 'element-plus/es/components/menu-item/style/css', + 'element-plus/es/components/option/style/css', + 'element-plus/es/components/dropdown/style/css', + 'element-plus/es/components/dropdown-menu/style/css', + 'element-plus/es/components/dropdown-item/style/css', + 'element-plus/es/components/skeleton/style/css', + 'element-plus/es/components/skeleton/style/css', + 'element-plus/es/components/backtop/style/css', + 'element-plus/es/components/menu/style/css', + 'element-plus/es/components/sub-menu/style/css', + 'element-plus/es/components/menu-item/style/css', + 'element-plus/es/components/dropdown/style/css', + 'element-plus/es/components/tree/style/css', + 'element-plus/es/components/dropdown-menu/style/css', + 'element-plus/es/components/dropdown-item/style/css', + 'element-plus/es/components/badge/style/css', + 'element-plus/es/components/breadcrumb/style/css', + 'element-plus/es/components/breadcrumb-item/style/css', + 'element-plus/es/components/image/style/css', + 'element-plus/es/components/collapse-transition/style/css', + 'element-plus/es/components/timeline/style/css', + 'element-plus/es/components/timeline-item/style/css', + 'element-plus/es/components/collapse/style/css', + 'element-plus/es/components/collapse-item/style/css', + 'element-plus/es/components/button-group/style/css', + 'element-plus/es/components/text/style/css' +] + +const exclude = [] + +export { include, exclude } diff --git a/build/plugins.ts b/build/plugins.ts new file mode 100644 index 0000000..2924f5b --- /dev/null +++ b/build/plugins.ts @@ -0,0 +1,107 @@ +/* + * @Description: + * @Author: June + * @Date: 2024-08-21 13:03:57 + * @LastEditTime: 2024-08-21 13:24:52 + * @LastEditors: June + */ +/* + * @Description: + * @Author: June + * @Date: 2024-08-21 13:03:57 + * @LastEditTime: 2024-08-21 13:12:03 + * @LastEditors: June + */ +import { PluginOption } from 'vite' +import electron from 'vite-plugin-electron' +import AutoImport from 'unplugin-auto-import/vite' +import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' +import Components from 'unplugin-vue-components/vite' +import { createSvgIconsPlugin } from 'vite-plugin-svg-icons' +import Unocss from 'unocss/vite' +import vueJsx from '@vitejs/plugin-vue-jsx' +import vue from '@vitejs/plugin-vue' +import * as path from 'path' +import { createHtmlPlugin } from 'vite-plugin-html' +import { isProd } from './getEnv' + +/** + * 创建 vite 插件 + * @param viteEnv + */ +export const createVitePlugins = ( + mode: string, + command: string, + viteEnv: any +): (PluginOption | PluginOption[])[] => { + const _isProd = isProd(mode) + const { APP_TITLE } = viteEnv + const plugins: PluginOption | PluginOption[] = [ + vue(), + AutoImport({ + resolvers: [ElementPlusResolver()], + eslintrc: { + enabled: true, // Default `false` + filepath: '../.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json` + globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable') + }, + + dts: path.join(__dirname, '../typings/auto-imports.d.ts'), + imports: ['vue', 'vue-router', 'vue-i18n'] + }), + Components({ + resolvers: [ElementPlusResolver()], + dirs: [path.join(__dirname, '../src/render/components')], + dts: path.join(__dirname, '../typings/components.d.ts') + }), + createHtmlPlugin({ + minify: _isProd, + inject: { + data: { + title: APP_TITLE + } + } + }), + createSvgIconsPlugin({ + iconDirs: [path.resolve(__dirname, '../src/render/assets/svgs')], // icon存放的目录 + symbolId: 'icon-[name]', // symbol的id + inject: 'body-last', // 插入的位置 + customDomId: '__svg__icons__dom__' // svg的id + }), + Unocss(), + vueJsx() + ] + if (command === 'serve' && mode === 'develectron') { + plugins.push( + electron([ + { + entry: path.resolve(__dirname, '../src/main/index.ts'), + vite: { + resolve: { + alias: { + '~': path.resolve(__dirname, '../src/main') + } + }, + build: { + outDir: path.resolve(__dirname, '../dist-electron/main') + } + } + }, + { + entry: path.resolve(__dirname, '../src/preload/index.ts'), + vite: { + resolve: { + alias: { + '~': path.resolve(__dirname, '../src/main') + } + }, + build: { + outDir: path.resolve(__dirname, '../dist-electron/preload') + } + } + } + ]) + ) + } + return plugins +} diff --git a/typings/env.d.ts b/typings/env.d.ts index 975ad48..80ae269 100644 --- a/typings/env.d.ts +++ b/typings/env.d.ts @@ -22,3 +22,13 @@ declare global { editor: Editor } } + +declare type Recordable = Record + +declare interface ViteEnv { + readonly APP_FLAG: string + readonly APP_TITLE: string + readonly APP_BASE_PATH: string + readonly APP_APIHOST: string + readonly APP_ADMINAPIHOST: string +} diff --git a/vite.config.mts b/vite.config.mts index 85d4a51..ce44b50 100644 --- a/vite.config.mts +++ b/vite.config.mts @@ -3,20 +3,13 @@ * @Description: * @Date: 2023-03-11 00:41:24 * @LastEditors: June - * @LastEditTime: 2024-08-21 01:56:00 + * @LastEditTime: 2024-08-21 13:16:30 */ import { defineConfig } from 'vite' import type { UserConfig, ConfigEnv } from 'vite' -import vue from '@vitejs/plugin-vue' import * as path from 'path' -import { createHtmlPlugin } from 'vite-plugin-html' -import electron from 'vite-plugin-electron' -import AutoImport from 'unplugin-auto-import/vite' -import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' -import Components from 'unplugin-vue-components/vite' -import { createSvgIconsPlugin } from 'vite-plugin-svg-icons' -import Unocss from 'unocss/vite' -import vueJsx from '@vitejs/plugin-vue-jsx' +import { exclude, include } from './build/optimize' +import { createVitePlugins } from './build/plugins' import { wrapperEnv, loadEnv } from './build/getEnv' export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => { @@ -24,77 +17,12 @@ export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => { const env = loadEnv(mode, `${root}/env`)! const viteEnv = wrapperEnv(env) const envPrefix = 'APP_' - const plugins = [ - vue(), - AutoImport({ - resolvers: [ElementPlusResolver()], - eslintrc: { - enabled: true, // Default `false` - filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json` - globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable') - }, - dts: path.join(root, './typings/auto-imports.d.ts'), - imports: ['vue', 'vue-router', 'vue-i18n'] - }), - Components({ - resolvers: [ElementPlusResolver()], - dirs: [path.join(root, 'src/render/components')], - dts: path.join(root, './typings/components.d.ts') - }), - createHtmlPlugin({ - inject: { - data: { - title: viteEnv.APP_TITLE - } - } - }), - createSvgIconsPlugin({ - iconDirs: [path.resolve(root, 'src/render/assets/svgs')], // icon存放的目录 - symbolId: 'icon-[name]', // symbol的id - inject: 'body-last', // 插入的位置 - customDomId: '__svg__icons__dom__' // svg的id - }), - Unocss(), - vueJsx() - ] - if (command === 'serve' && mode === 'develectron') { - plugins.push( - electron([ - { - entry: path.resolve(__dirname, 'src/main/index.ts'), - vite: { - resolve: { - alias: { - '~': path.resolve(__dirname, 'src/main') - } - }, - build: { - outDir: path.resolve(__dirname, 'dist-electron/main') - } - } - }, - { - entry: path.resolve(__dirname, 'src/preload/index.ts'), - vite: { - resolve: { - alias: { - '~': path.resolve(__dirname, 'src/main') - } - }, - build: { - outDir: path.resolve(__dirname, 'dist-electron/preload') - } - } - } - ]) - ) - } return { root: path.resolve(__dirname, 'src/render'), base: './', publicDir: 'resources', - plugins, + plugins: createVitePlugins(mode, command, viteEnv), server: { port: 3000, open: true, @@ -118,6 +46,7 @@ export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => { } }, envPrefix, + optimizeDeps: { include, exclude }, resolve: { alias: { '@': path.resolve(__dirname, 'src/render'),