fix style and add plugin

Vite/plugins/compression.ts

@@ -0,0 +1,28 @@
+import compression from 'vite-plugin-compression';
+
+export default function createCompression(env) {
+	const { VITE_BUILD_COMPRESS } = env;
+	const plugin: any[] = [];
+	if (VITE_BUILD_COMPRESS) {
+		const compressList = VITE_BUILD_COMPRESS.split(',');
+		if (compressList.includes('gzip')) {
+			// http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
+			plugin.push(
+				compression({
+					ext: '.gz',
+					deleteOriginFile: false
+				})
+			);
+		}
+		if (compressList.includes('brotli')) {
+			plugin.push(
+				compression({
+					ext: '.br',
+					algorithm: 'brotliCompress',
+					deleteOriginFile: false
+				})
+			);
+		}
+	}
+	return plugin;
+}

Vite/plugins/index.ts

@@ -4,6 +4,7 @@ import createAutoImport from './auto-import';
 import createComponents from './components';
 import createIcons from './icons';
 import createSvgIconsPlugin from './svg-icon';
+import createCompression from './compression';
 import path from 'path';
 
 export default (viteEnv, isBuild = false): [] => {
@@ -12,7 +13,8 @@ export default (viteEnv, isBuild = false): [] => {
 	vitePlusgins.push(createUnoCss());
 	vitePlusgins.push(createAutoImport(path));
 	vitePlusgins.push(createComponents(path));
+	vitePlusgins.push(createCompression(viteEnv));
 	vitePlusgins.push(createIcons());
-	vitePlusgins.push(createSvgIconsPlugin(path));
+	vitePlusgins.push(createSvgIconsPlugin(path, isBuild));
 	return vitePlusgins;
 };

Vite/plugins/svg-icon.ts

@@ -1,9 +1,10 @@
 import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
-export default (path: any) => {
+export default (path: any, isBuild: boolean) => {
 	return createSvgIconsPlugin({
 		// 指定需要缓存的图标文件夹
 		iconDirs: [path.resolve(path.resolve(__dirname, '../../src'), 'assets/icons/svg')],
 		// 指定symbolId格式
-		symbolId: 'icon-[dir]-[name]'
+		symbolId: 'icon-[dir]-[name]',
+		svgoOptions: isBuild
 	});
 };

src/assets/styles/index.scss

@@ -6,7 +6,7 @@
 @import './btn.scss';
 @import './ruoyi.scss';
 @import 'animate.css';
-// @import 'element-plus/dist/index.css';
+@import 'element-plus/dist/index.css';
 
 body {
 	height: 100%;

src/types/auto-imports.d.ts

@@ -8,6 +8,7 @@ declare global {
   const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
   const ElNotification: typeof import('element-plus/es')['ElNotification']
   const ElSelect: typeof import('element-plus/es')['ElSelect']
+  const ElTable: typeof import('element-plus/es')['ElTable']
   const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
   const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
   const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
@@ -293,6 +294,7 @@ declare module 'vue' {
     readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
     readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
     readonly ElSelect: UnwrapRef<typeof import('element-plus/es')['ElSelect']>
+    readonly ElTable: UnwrapRef<typeof import('element-plus/es')['ElTable']>
     readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
     readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
     readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>