const path = require("path"); const resolve = (dir) => path.join(__dirname, dir); const IS_PROD = ["production", "prod"].includes(process.env.NODE_ENV); const BundleAnalyzerPlugin = require("webpack-bundle-analyzer") .BundleAnalyzerPlugin; module.exports = { publicPath: "./", // 编译后的地址,可以根据环境进行设置 outputDir: "dist", // 生产环境构建文件的目录 assetsDir: "static", // 静态文件目录 lintOnSave: false, //是否开启编译时是否不符合eslint提示 productionSourceMap: false, // 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。 devServer: { hot:true, port: 8080, // 端口 open: false, // 启动后打开浏览器 compress: true, overlay: { // 当出现编译器错误或警告时,在浏览器中显示全屏覆盖层 warnings: false, errors: true, }, proxy: { "/": { target:"http://lead.xc.com:32269", changeOrigin: true, ws:true, }, }, disableHostCheck: true }, css: { extract: IS_PROD, // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。 sourceMap: false, }, chainWebpack: (config) => { config.plugin('html').tap(args => { args[0].title = '云平台'; return args; }); config.resolve.alias .set("@", resolve("src")) .set("assets", resolve("src/assets")) .set("components", resolve("src/components")) .set("router", resolve("src/router")) .set("utils", resolve("src/utils")) .set("store", resolve("src/store")) .set("views", resolve("src/views")) .set("api", resolve("src/api")); if (IS_PROD) { config.plugin("webpack-report").use(BundleAnalyzerPlugin, [ { analyzerMode: "static", }, ]); } config.when(IS_PROD, (config) => { config.devtool("cheap-source-map"); config .plugin("ScriptExtHtmlWebpackPlugin") .after("html") .use("script-ext-html-webpack-plugin") .end(); config.optimization.splitChunks({ chunks: "all", cacheGroups: { // cacheGroups 下可以可以配置多个组,每个组根据test设置条件,符合test条件的模块 commons: { name: "chunk-commons", test: resolve("src/components"), minChunks: 3, // 被至少用三次以上打包分离 priority: 5, // 优先级 reuseExistingChunk: true, // 表示是否使用已有的 chunk,如果为 true 则表示如果当前的 chunk 包含的模块已经被抽取出去了,那么将不会重新生成新的。 }, node_vendors: { name: "chunk-libs", chunks: "initial", // 只打包初始时依赖的第三方 test: /[\\/]node_modules[\\/]/, priority: 10, }, elementUI: { name: "chunk-elementUI", // 单独将 elementUI 拆包 priority: 20, // 数字大权重到,满足多个 cacheGroups 的条件时候分到权重高的 test: /[\\/]node_modules[\\/]_?element(.*)/, }, }, }); config.optimization.runtimeChunk("single"); config.optimization.minimize(true); }); }, };