Gary Gu
7 days ago c139d1c4ecfc45bd1e2b95e23a29eec75d04db5e
vite.config.js
@@ -13,111 +13,118 @@
import PluginForViteVue2 from "@vitejs/plugin-vue2";
// 屏幕适配
const px2rem = require("postcss-px2rem")
    // 配置基本大小
const px2rem = require("postcss-px2rem");
// 配置基本大小
const postcss = px2rem({
    //配rem基准值 基准大小 baseSize
    remUnit: 192, // 设稿尺1920/10
})
  //配rem基准值 基准大小 baseSize
  remUnit: 192, // 设稿尺1920/10
});
export default defineConfig(({ mode }) => {
    return {
        resolve: {
            alias: {
                "@": path.resolve(__dirname, './src'),
                "@css": path.resolve("./src/assets/css"),
                'worker-loader': require.resolve('worker-loader'),
            },
  return {
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "./src"),
        "@css": path.resolve("./src/assets/css"),
        "worker-loader": require.resolve("worker-loader"),
      },
    },
    worker: {
      // 例如,设置一个worker的入口文件
      // 注意:这是一个假设的配置,具体取决于worker-loader是否支持这样的配置
      // entry: '/path/to/worker/entry.js',
      options: { inline: true, name: "workerName.[hash].js" },
    },
    plugins: [PluginForViteVue2(), splitVendorChunkPlugin()],
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: "@import '@css/sass.scss';",
        },
        worker: {
            // 例如,设置一个worker的入口文件
            // 注意:这是一个假设的配置,具体取决于worker-loader是否支持这样的配置
            // entry: '/path/to/worker/entry.js',
            options: { inline: true, name: 'workerName.[hash].js' }
      },
      loaderOptions: {
        postcss: {
          plugins: [postcss],
        },
        plugins: [PluginForViteVue2(), splitVendorChunkPlugin()],
        css: {
            preprocessorOptions: {
                scss: {
                    additionalData: "@import '@css/sass.scss';",
                },
            },
            loaderOptions: {
                postcss: {
                    plugins: [postcss]
                }
      },
    },
    server: {
      proxy: {
        "^/api/": {
          // target: "http://47.117.124.20:2002/",
          target: "http://101.201.155.10:4011/",
          rewrite: (path) => path.replace(/^\/api\//, ""),
          changeOrigin: true, //通过浏览器查看像是"未生效",实际发送给后端的是更改过的Host(与target的host相同)
        },
      },
      port: 8081,
      host: "0.0.0.0",
      cors: true,
      open: true,
    },
    esbuild: {
      treeShaking: true,
      drop: mode === "production" ? ["console", "debugger"] : [],
    },
    chainWebpack(config) {
      config.module
        .rule("css")
        .test(/\.css$/)
        .oneOf("vue")
        .use("px2rem-loader")
        .loader("px2rem-loader")
        .options({
          remUnit: 192,
        })
        .end();
    },
    build: {
      minify: "esbuild",
      chunkSizeWarningLimit: 500, //kbs
      rollupOptions: {
        output: {
          chunkFileNames: "assets/js/[name]-[hash].js",
          entryFileNames: "assets/js/[name]-[hash].js",
          assetFileNames: "assets/[ext]/[name]-[hash].[ext]",
          // manualChunks(id) {
          //   if (id.includes("/node_modules/")) {
          //     const name = id.split("/node_modules/")[1].split("/")[0];
          //     for (const key of Object.keys(ChunksMap)) {
          //       if (ChunksMap[key].includes(name)) {
          //         return key;
          //       }
          //     }
          //     return "vendor";
          //   }
          // },
          // eslint-disable-next-line no-unused-vars
          // manualChunks(id, { getModuleInfo, getModuleIds }) {
          //   const getShouldBeVendor = splitVendorChunk();
          //   const chunkName = getShouldBeVendor(id, { getModuleInfo });
          //   if (chunkName === "vendor") {
          //     //1 在node_modules文件夹下
          //     //2 不是css类请求
          //     //3 是被静态引入的
          //     return chunkName;
          //   } else if (id.includes("src")) {
          //     const moduleInfo = getModuleInfo(id);
          //     // console.log(id, "importers", moduleInfo.importers);
          //     // console.log(id, "dynamicImporters", moduleInfo.dynamicImporters);
          //     if (moduleInfo.importers.length + moduleInfo.dynamicImporters.length > 1) {
          //       return "manifest";
          //     }
          //   }
          // },
          // eslint-disable-next-line no-unused-vars
          manualChunks(id) {
            if (id.includes("/node_modules/")) {
              return id.split("/node_modules/")[1].split("/")[0];
            }
          },
        },
        server: {
            proxy: {
                "^/api/": {
                    // target: "http://47.117.124.20:2002/",
                    target: "http://8.140.54.245:5000/",
                    rewrite: (path) => path.replace(/^\/api\//, ""),
                    changeOrigin: true, //通过浏览器查看像是"未生效",实际发送给后端的是更改过的Host(与target的host相同)
                },
            },
            port: 3000,
            host: "0.0.0.0",
            cors: true,
            open: true,
        },
        esbuild: {
            treeShaking: true,
            drop: mode === "production" ? ["console", "debugger"] : [],
        },
        chainWebpack(config) {
            config.module.rule("css").test(/\.css$/).oneOf("vue").use("px2rem-loader").loader("px2rem-loader").options({
                remUnit: 192,
            }).end();
        },
        build: {
            minify: "esbuild",
            chunkSizeWarningLimit: 500, //kbs
            rollupOptions: {
                output: {
                    chunkFileNames: "assets/js/[name]-[hash].js",
                    entryFileNames: "assets/js/[name]-[hash].js",
                    assetFileNames: "assets/[ext]/[name]-[hash].[ext]",
                    // manualChunks(id) {
                    //   if (id.includes("/node_modules/")) {
                    //     const name = id.split("/node_modules/")[1].split("/")[0];
                    //     for (const key of Object.keys(ChunksMap)) {
                    //       if (ChunksMap[key].includes(name)) {
                    //         return key;
                    //       }
                    //     }
                    //     return "vendor";
                    //   }
                    // },
                    // eslint-disable-next-line no-unused-vars
                    // manualChunks(id, { getModuleInfo, getModuleIds }) {
                    //   const getShouldBeVendor = splitVendorChunk();
                    //   const chunkName = getShouldBeVendor(id, { getModuleInfo });
                    //   if (chunkName === "vendor") {
                    //     //1 在node_modules文件夹下
                    //     //2 不是css类请求
                    //     //3 是被静态引入的
                    //     return chunkName;
                    //   } else if (id.includes("src")) {
                    //     const moduleInfo = getModuleInfo(id);
                    //     // console.log(id, "importers", moduleInfo.importers);
                    //     // console.log(id, "dynamicImporters", moduleInfo.dynamicImporters);
                    //     if (moduleInfo.importers.length + moduleInfo.dynamicImporters.length > 1) {
                    //       return "manifest";
                    //     }
                    //   }
                    // },
                    // eslint-disable-next-line no-unused-vars
                    manualChunks(id) {
                        if (id.includes("/node_modules/")) {
                            return id.split("/node_modules/")[1].split("/")[0];
                        }
                    },
                },
            },
        },
    };
});
      },
    },
  };
});