1

resources/js/utils/rollup.ts

+export class SplitVendorChunkCache {
+    constructor() {
+        this.cache = new Map();
+    }
+
+    reset() {
+        this.cache = new Map();
+    }
+}
+
+export function staticImportedByEntry(
+    id,
+    getModuleInfo,
+    cache,
+    importStack = []
+) {
+    if (cache.has(id)) {
+        return !!cache.get(id);
+    }
+    if (importStack.includes(id)) {
+        cache.set(id, false);
+        return false;
+    }
+    const mod = getModuleInfo(id);
+    if (!mod) {
+        cache.set(id, false);
+        return false;
+    }
+    if (mod.isEntry) {
+        cache.set(id, true);
+        return true;
+    }
+    const someImporterIs = mod.importers.some((importer) =>
+        staticImportedByEntry(
+            importer,
+            getModuleInfo,
+            cache,
+            importStack.concat(id)
+        )
+    );
+    cache.set(id, someImporterIs);
+    return someImporterIs;
+}

vite.config.js

@@ -3,11 +3,12 @@ import laravel from 'laravel-vite-plugin';
 import React from '@vitejs/plugin-react';
 import viteCompression from 'vite-plugin-compression';
 import svgr from 'vite-plugin-svgr';
+// import {SplitVendorChunkCache, staticImportedByEntry} from './resources/js/utils/rollup';
 
+// const cache = new SplitVendorChunkCache();
 export default defineConfig({
     plugins: [laravel({
-        input: ['resources/js/app.jsx'], refresh: false,
-        // 构建ssr
+        input: ['resources/js/app.jsx'], refresh: false, // 构建ssr
         ssr: 'resources/js/ssr.jsx',
     }), React(), viteCompression(), svgr()], server: {
         port: 3008, host: '127.0.0.1', proxy: {
@@ -17,32 +18,39 @@ export default defineConfig({
         esbuildOptions: {
             loader: {'.tsx': 'jsx'}
         }
-    },
-    resolve: {
+    }, resolve: {
         alias: {
             '@': '/resources'
         }
-    },
-    build: {
+    }, build: {
         minify: 'terser', // 混淆器，terser构建后文件体积更小
         terserOptions: {
             compress: {
                 //生产环境时移除console
-                drop_console: true,
-                // drop_debugger: true,
-            },
-            output: {
+                drop_console: true, // drop_debugger: true,
+            }, output: {
                 // 去掉注释内容
                 comments: false,
             },
-        },
-        rollupOptions: {
+        }, rollupOptions: {
             output: {
-                manualChunks: {
-                    // 拆分代码，这个就是分包，配置完后自动按需加载
-                    // react: ['react'],
-                    // 'tdesign-react': ['tdesign-react'],
-                },
+                // manualChunks: {
+                //     // 拆分代码，这个就是分包，配置完后自动按需加载
+                //     // react: ['react'],
+                //     // 'tdesign-react': ['tdesign-react'],
+                // },
+                // manualChunks(id, {getModuleInfo}) {
+                //     const cssLangs = `\\.(css|less|sass|scss|styl|stylus|pcss|postcss)($|\\?)`;
+                //     const cssLangRE = new RegExp(cssLangs);
+                //     const isCSSRequest = (request) => cssLangRE.test(request);
+                //     // 分vendor包
+                //     if (id.includes('node_modules') && !isCSSRequest(id) && staticImportedByEntry(id, getModuleInfo, cache.cache)) {
+                //         return 'vendor';
+                //     } else if (// 分manifest包，解决chunk碎片问题
+                //         ((getModuleInfo(id).importers.length + getModuleInfo(id).dynamicImporters.length) > 1) && id.includes('src')) {
+                //         return 'manifest_c';
+                //     }
+                // }
             },
         },
     },