feat: 优化打包设置

src/components/HomeIndex/index.tsx

@@ -6,8 +6,7 @@ import SvgIcon from '@/components/SvgIcon/SvgIcon.tsx'
 const HomeIndex: React.FC = () => {
     useEffect(() => {
         document.body.classList.add('body')
-        window.onload = function () {
+			if (!CSS.supports('animation-timeline: scroll()')) {
-            if (!CSS.supports('animation-timeline: scroll()')) {
                 // const SPAN = 'max(45vw, 260px)';
                 const CONFIG = [
                     {
@@ -190,8 +189,6 @@ const HomeIndex: React.FC = () => {
                     },
                 })
             }
-        }
-
         return () => {
             document.body.classList.remove('body')
         }

src/main.tsx

@@ -6,6 +6,7 @@ import routeConfig from './router'
 import 'virtual:svg-icons-register'
 import { Provider as MobxProvider } from 'mobx-react'
 import { RootStore } from '@/store'
+import 'vite/modulepreload-polyfill'
 const router = createBrowserRouter(routeConfig)
 ReactDOM.createRoot(document.getElementById('root')!).render(
     // <React.StrictMode>

vite.config.ts

@@ -121,46 +121,35 @@ export default defineConfig(({ mode }) => {
                 },
             },
         },
+		esbuild: {
+			drop: ["console", "debugger"],
+		},
         build: {
-            // target: ['es2015'], // 设置最终构建的浏览器兼容目标
-            moduleResolution: 'node', // 决定如何处理模块。
             outDir: 'dist', // 指定输出路径
             assetsDir: 'assets', // 指定生成静态文件目录
             assetsInlineLimit: '4096', // 小于此阈值的导入或引用资源将内联为 base64 编码
             cssCodeSplit: true, // 启用 CSS 代码拆分
-            // cssTarget: '', // 允许用户为 CSS 的压缩设置一个不同的浏览器 target 与 build.target 一致
             sourcemap: false, // 构建后是否生成 source map 文件
-
+            minify: 'esbuild', // 指定使用哪种混淆器
-            // lib: {}, // 构建为库
+			polyfillModulePreload: true,
-            manifest: false, // 当设置为 true，构建后将会生成 manifest.json 文件
-            ssrManifest: false, // 构建不生成 SSR 的 manifest 文件
-            ssr: undefined, // 生成面向 SSR 的构建
-            minify: 'terser', // 指定使用哪种混淆器
-            // 传递给 Terser 的更多 minify 选项
-            terserOptions: {
-                compress: {
-                    drop_console: true,
-                    drop_debugger: true,
-                },
-            },
             write: true, // 启用将构建后的文件写入磁盘
             emptyOutDir: true, // 构建时清空该目录
             brotliSize: true, // 启用 brotli 压缩大小报告
             chunkSizeWarningLimit: 2000, // chunk 大小警告的限制
             watch: null, // 设置为 {} 则会启用 rollup 的监听器
-            // rollupOptions: {
+            rollupOptions: {
-            //     // 自定义底层的 Rollup 打包配置
+                // 自定义底层的 Rollup 打包配置
-            //     output: {
+                output: {
-            //         chunkFileNames: 'js/[name]-[hash].js', // 引入文件名的名称
+                    chunkFileNames: 'js/[name]-[hash].js', // 引入文件名的名称
-            //         entryFileNames: 'js/[name]-[hash].js', // 包的入口文件名称
+                    entryFileNames: 'js/[name]-[hash].js', // 包的入口文件名称
-            //         assetFileNames: '[ext]/[name]-[hash].[ext]', // 资源文件像 字体，图片等
+                    assetFileNames: '[ext]/[name]-[hash].[ext]', // 资源文件像 字体，图片等
-            //         manualChunks(id: any) {
+                    manualChunks(id: any) {
-            //             if (id.includes('node_modules')) {
+                        if (id.includes('node_modules')) {
-            //                 return id.toString().split('node_modules/')[1].split('/')[0].toString()
+                            return id.toString().split('node_modules/')[1].split('/')[0].toString()
-            //             }
+                        }
-            //         },
+                    },
-            //     },
+                },
-            // },
+            },
         },
         server: {
             proxy: {