const path = require("path"); const TerserPlugin = require("terser-webpack-plugin"); const CssMinimizerPlugin = require("css-minimizer-webpack-plugin"); const WorkboxPlugin = require("workbox-webpack-plugin"); const HappyPack = require("happypack"); const webpack = require("webpack"); // const HtmlWebpackPlugin = require("html-webpack-plugin"); function resolve(dir) { return path.join(__dirname, dir); } /** 仅注册已配置 target 的代理,避免 undefined 导致 devServer 启动失败 */ function buildDevProxy(routes) { return routes.reduce((proxy, route) => { if (!route.target) return proxy; const { context, target, pathRewrite, onProxyReq } = route; proxy[context] = { target, changeOrigin: true, ...(pathRewrite ? { pathRewrite } : {}), ...(onProxyReq ? { onProxyReq } : {}), }; return proxy; }, {}); } module.exports = { chainWebpack(config) { config.module.rule("svg").exclude.add(resolve("src/icons")).end(); config.module .rule("icons") .test(/\.svg$/) .include.add(resolve("src/icons")) .end() .use("svg-sprite-loader") .loader("svg-sprite-loader") .options({ symbolId: "icon-[name]", }) .end(); config.plugin("happypack").use(HappyPack, [ { loaders: ["babel-loader"], }, ]); // config.plugin('dll').use(webpack.DllPlugin, [ // { // name: '[name]_library', // path: path.join(__dirname, 'dll', '[name]-manifest.json'), // }, // ]); // 仅生产构建注册 Service Worker:dev server(--watch)下 GenerateSW 重复调用 // 存在已知问题——首次生成的 precache 版本号后续不会正确更新,会导致浏览器 // 一直用旧缓存响应请求,改代码、重启 dev server、强制刷新都不生效。 if (process.env.NODE_ENV === "production") { config.plugin("workbox").use(WorkboxPlugin.GenerateSW, [ { clientsClaim: true, skipWaiting: true, }, ]); } }, css: { loaderOptions: { postcss: { postcssOptions: { plugins: [require("tailwindcss"), require("autoprefixer")], }, }, sass: { additionalData: ` @import "@/styles/global.scss"; `, }, }, }, devServer: { // contentBase: path.join(__dirname, "public"), // 页面 IP/端口:在各 .env.* 中配置 VUE_APP_DEV_HOST、VUE_APP_DEV_PORT host: process.env.VUE_APP_DEV_HOST || "localhost", port: process.env.VUE_APP_DEV_PORT ? Number(process.env.VUE_APP_DEV_PORT) : 8080, proxy: buildDevProxy([ { context: "/api", target: process.env.VUE_APP_APIPROXY, pathRewrite: { "^/api": "" }, }, { context: "/DatangEnosData", target: process.env.VUE_APP_DatangEnosData_APIPROXY, pathRewrite: { "^/DatangEnosData": "" }, }, // 健康分析接口(勿用 /health,避免与路由 /home/health 及 history 回退冲突) { context: "/healthApi", target: process.env.VUE_APP_HEALTH_APIPROXY, pathRewrite: { "^/healthApi": "" }, }, // 振动、激光测距仪 { context: "/WZLapi", target: process.env.VUE_APP_WZLAPIPROXY, pathRewrite: { "^/WZLapi": "" }, }, { context: "/ETLapi", target: process.env.VUE_APP_ETLAPIPROXY, pathRewrite: { "^/ETLapi": "" }, onProxyReq(proxyReq) { console.log("Proxying /ETLapi request to:", proxyReq.path); }, }, { context: "/tiles", target: process.env.VUE_APP_MAP, pathRewrite: { "^/tiles": "/tiles" }, }, { context: "/AnalysisMulti", target: process.env.VUE_APP_AnalysisMultiAPIPROXY, pathRewrite: { "^/AnalysisMulti": "" }, }, { context: "/transDataWeb", target: process.env.VUE_APP_WZLAPIPROXY, pathRewrite: { "^/transDataWeb": "" }, }, { context: "/sAlgorithm", target: process.env.VUE_APP_sAlgorithmAPIPROXY, pathRewrite: { "^/sAlgorithm": "" }, }, { context: "/databaseApi", target: process.env.VUE_APP_databaseApiAPIPROXY, pathRewrite: { "^/databaseApi": "" }, }, { context: "/downLoadChart", target: process.env.VUE_APP_downLoadChartAPIPROXY, pathRewrite: { "^/downLoadChart": "" }, }, ]), }, configureWebpack: { resolve: { alias: { "@": resolve("src"), }, }, optimization: { usedExports: true, splitChunks: { chunks: "all", }, minimize: true, minimizer: [new TerserPlugin(), new CssMinimizerPlugin()], }, // plugins: [ // new HtmlWebpackPlugin({ // filename: "custom-filename.html", // 自定义输出的 HTML 文件名 // title: "风机运行管理系统", // 设置页面的标题 // // 其他配置... // }), // // 其他插件... // ], }, pluginOptions: { "style-resources-loader": { preProcessor: "sass", patterns: [], }, }, configureWebpack: { devtool: "source-map", }, };