515

package.json

@@ -40,6 +40,7 @@
     "three": "^0.174.0",
     "v-scale-screen": "^2.2.0",
     "vite-plugin-monaco-editor": "^1.1.0",
+    "vite-plugin-remove-console": "^2.2.0",
     "vue": "^3.3.4",
     "vue-monaco-editor": "^0.0.19",
     "vue-pdf-embed": "^2.1.2",
@@ -61,6 +62,7 @@
     "unplugin-auto-import": "^0.16.6",
     "unplugin-vue-components": "^0.25.2",
     "vite": "^4.4.5",
+    "vite-plugin-imagemin": "^0.6.1",
     "vite-plugin-vue-setup-extend": "^0.4.0",
     "vue-tsc": "^1.8.5"
   }

vite.config.ts

@@ -1,6 +1,8 @@
 import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import monacoEditorPlugin from 'vite-plugin-monaco-editor';
+import viteImagemin from 'vite-plugin-imagemin';
+import removeConsole from 'vite-plugin-remove-console';
 
 //1、 导入 path 模块，帮助我们解析路径
 import { resolve } from 'path'
@@ -22,6 +24,32 @@ export default defineConfig(({ mode }) => {
         base: "./",
         plugins: [
             vue(), 
+            removeConsole(),
+            viteImagemin({
+                // imagemin 配置项
+                gifsicle: {
+                  optimizationLevel: 7,
+                  interlaced: false,
+                },
+                optipng: {
+                  optimizationLevel: 7,
+                },
+                mozjpeg: {
+                  quality: 20,
+                },
+                pngquant: {
+                  quality: [0.8, 0.9],
+                  speed: 4,
+                },
+                svgo: {
+                  plugins: [
+                    {
+                      name: 'removeViewBox',
+                      active: false,
+                    },
+                  ],
+                },
+              }),
             monacoEditorPlugin({}), // 启用 Monaco Editor 插件
             AutoImport({
                 //安装两行后你会发现在组件中不用再导入ref，reactive等