var path = require("path"); var webpack = require("webpack"); var HtmlwebpackPlugin = require("html-webpack-plugin"); // 引入happypack 实现多线程打包 var HappyPack = require("happypack"); var os = require("os"); var happyThreadPool = HappyPack.ThreadPool({ size: os.cpus().length }); let BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin; function date() { let nowDate = new Date(); let year = nowDate.getFullYear(); let month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1) : nowDate.getMonth() + 1; let day = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate(); let hours = nowDate.getHours() < 10 ? "0" + nowDate.getHours() : nowDate.getHours(); let dateStr = year + "_" + month + day + "_" + hours; return dateStr; } // 基础配置 const config = { mode: process.env.NODE_ENV === "production" ? "production" : "development", entry: { // 注意:这里需要修改,应该只有一个 polyfill,并且作为第一个入口 // 或者使用 babel-polyfill 在入口文件中引入 gwDdIndex: ["babel-polyfill", "./src/pages/gwDdIndex.js"], jobAccount: ["babel-polyfill", "./src/pages/jobAccount.js"], problemSeeXsk: ["babel-polyfill", "./src/pages/problemSeeXsk.js"], problemSeeRy: ["babel-polyfill", "./src/pages/problemSeeRy.js"], problemSeeSh: ["babel-polyfill", "./src/pages/problemSeeSh.js"], problemSeeDxs: ["babel-polyfill", "./src/pages/problemSeeDxs.js"], problemSeeSz: ["babel-polyfill", "./src/pages/problemSeeSz.js"], home: ["babel-polyfill", "./src/pages/home.js"], map3D: ["babel-polyfill", "./src/pages/map3D.js"], inspectionPlanQuery: [ "babel-polyfill", "./src/pages/inspectionPlanQuery.js", ], }, output: { path: path.resolve(__dirname, "./dist"), publicPath: "./", // 关键:使用相对路径 filename: "[name]_build.js", chunkFilename: "chunk_[name].[chunkhash].js", }, optimization: { minimize: false, splitChunks: { chunks: "all", cacheGroups: { vendors: { test: /[\\/]node_modules[\\/]/, name: "vendors", chunks: "all", }, commons: { name: "commons", chunks: "initial", minChunks: 2, }, }, }, }, plugins: [], module: { rules: [ { test: /\.css$/, use: ["vue-style-loader", "css-loader"], }, { test: /\.(woff|svg|eot|ttf)\??.*$/, loader: "url-loader", }, { test: /\.vue$/, use: "happypack/loader?id=happyvue", }, { test: /\.js$/, use: "happypack/loader?id=happybabel", exclude: /(node_modules|dist|static)/, }, { test: /\.(png|jpg|gif|svg)$/, loader: "file-loader", options: { name: "[name].[ext]?[hash]", }, }, ], }, resolve: { alias: { vue$: "vue/dist/vue.esm.js", "@api": path.resolve("src/api"), "@widget": path.resolve("src/widgets"), "@util": path.resolve("src/utils"), "@baseWidget": path.resolve("src/widgets/baseWidget"), "@scss": path.resolve("src/assets/sass"), }, extensions: [".html", ".js", ".vue", ".json", ".scss"], modules: [path.resolve("src"), path.resolve("node_modules")], }, performance: { hints: false, }, }; // 开发环境配置 if (process.env.NODE_ENV !== "production") { config.devtool = "cheap-module-eval-source-map"; config.plugins = [ new webpack.HotModuleReplacementPlugin(), new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", jquery: "jquery", "window.jQuery": "jquery", }), new HappyPack({ id: "happybabel", loaders: [ { loader: "babel-loader", options: { presets: ["es2015"], plugins: ["syntax-dynamic-import"], cacheDirectory: true, }, }, ], threadPool: happyThreadPool, verbose: true, }), new HappyPack({ id: "happyvue", loaders: ["vue-loader"], threadPool: happyThreadPool, verbose: true, }), // HTML 插件 new HtmlwebpackPlugin({ filename: "index.html", template: "./src/pages/gwDdIndex.html", chunks: ["gwDdIndex"], inject: "body", // 确保脚本注入到 body 末尾 hash: true, // 添加 hash 防止缓存 }), new HtmlwebpackPlugin({ filename: "jobAccount.html", template: "./src/pages/jobAccount.html", chunks: ["jobAccount"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeXsk.html", template: "./src/pages/problemSeeXsk.html", chunks: ["problemSeeXsk"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeRy.html", template: "./src/pages/problemSeeRy.html", chunks: ["problemSeeRy"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeSh.html", template: "./src/pages/problemSeeSh.html", chunks: ["problemSeeSh"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeDxs.html", template: "./src/pages/problemSeeDxs.html", chunks: ["problemSeeDxs"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeSz.html", template: "./src/pages/problemSeeSz.html", chunks: ["problemSeeSz"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "home.html", template: "./src/pages/home.html", chunks: ["home"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "map3D.html", template: "./src/pages/map3D.html", chunks: ["map3D"], inject: "body", hash: true, }), new HtmlwebpackPlugin({ filename: "inspectionPlanQuery.html", template: "./src/pages/inspectionPlanQuery.html", chunks: ["inspectionPlanQuery"], inject: "body", hash: true, }), ]; // 开发服务器配置 config.devServer = { proxy: { "/pdcApi": { // target: "http://39.98.38.2:18089/dc-api/", target: "http://127.0.0.1:8500", changeOrigin: true, pathRewrite: { "^/pdcApi": "", }, }, "/trs": { target: "http://10.1.194.19:8080", changeOrigin: true, pathRewrite: { "^/trs": "", }, }, "/arcgisApi/": { target: "http://hzz-pad.goldenwater.com.cn/arcgisApi/", changeOrigin: true, pathRewrite: { "^/arcgisApi/": "", }, }, "/JsReport/": { target: "http://pdc.goldenwater.com.cn/JsReport/", changeOrigin: true, pathRewrite: { "^/JsReport": "", }, }, "/demo/": { target: "http://10.1.102.136:8888/demo/", changeOrigin: true, pathRewrite: { "^/demo": "", }, }, "/pageofficePath/": { // target: "http://pdc.goldenwater.com.cn/pageofficePath/", target: "http://127.0.0.1:9002/", changeOrigin: true, pathRewrite: { "^/pageofficePath": "", }, }, "/pageoffice/": { target: "http://127.0.0.1:9002", changeOrigin: true, pathRewrite: { "^/pageoffice": "", }, }, }, host: "localhost", port: 8082, open: true, hot: true, inline: true, compress: true, contentBase: path.join(__dirname, "dist"), publicPath: "/", watchContentBase: true, // 关键:简化 historyApiFallback historyApiFallback: { rewrites: [ { from: /./, to: "/index.html" }, // 所有路径都重定向到 index.html ], }, overlay: { errors: true, warnings: false, }, stats: "minimal", noInfo: true, }; } // 生产环境配置 if (process.env.NODE_ENV === "production") { config.devtool = false; config.optimization.minimize = true; config.output = { path: path.resolve(__dirname, "./dist"), publicPath: "./", // 生产环境也用相对路径 filename: "[name]_build_v" + date() + ".js", chunkFilename: "chunk_[name]_v" + date() + ".[chunkhash].js", }; config.plugins = [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", jquery: "jquery", "window.jQuery": "jquery", }), new HappyPack({ id: "happybabel", loaders: [ { loader: "babel-loader", options: { presets: ["es2015"], plugins: ["syntax-dynamic-import"], cacheDirectory: true, }, }, ], threadPool: happyThreadPool, verbose: true, }), new HappyPack({ id: "happyvue", loaders: ["vue-loader"], threadPool: happyThreadPool, verbose: true, }), new webpack.DefinePlugin({ "process.env": { NODE_ENV: '"production"', }, }), new webpack.LoaderOptionsPlugin({ minimize: true, }), // HTML 插件 new HtmlwebpackPlugin({ filename: "index.html", template: "./src/pages/gwDdIndex.html", chunks: ["gwDdIndex"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "jobAccount.html", template: "./src/pages/jobAccount.html", chunks: ["jobAccount"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeXsk.html", template: "./src/pages/problemSeeXsk.html", chunks: ["problemSeeXsk"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeRy.html", template: "./src/pages/problemSeeRy.html", chunks: ["problemSeeRy"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeSh.html", template: "./src/pages/problemSeeSh.html", chunks: ["problemSeeSh"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeDxs.html", template: "./src/pages/problemSeeDxs.html", chunks: ["problemSeeDxs"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "problemSeeSz.html", template: "./src/pages/problemSeeSz.html", chunks: ["problemSeeSz"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "home.html", template: "./src/pages/home.html", chunks: ["home"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "map3D.html", template: "./src/pages/map3D.html", chunks: ["map3D"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), new HtmlwebpackPlugin({ filename: "inspectionPlanQuery.html", template: "./src/pages/inspectionPlanQuery.html", chunks: ["inspectionPlanQuery"], inject: "body", minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true, }, hash: true, }), // 可选:分析插件 new BundleAnalyzerPlugin({ analyzerMode: "static", openAnalyzer: false, }), ]; } module.exports = config;