生产和暂存构建不同

Question

我的应用程序有 3 个环境，这会更改 API 基本 url：

\n

\xe2\x80\xa2 生产

\n

\xe2\x80\xa2 暂存

\n

\xe2\x80\xa2 本地

\n

当构建我的生产应用程序时，我使用它$ vue-cli-service build以应有的方式构建一切，完美！

\n

当我使用分段构建时$ vue-cli-service build --mode staging，这给我带来了一些问题：

\n

\xe2\x80\xa2 我的文件具有与生产环境不同的压缩风格；

\n

\xe2\x80\xa2 我的文件经过 \xe2\x80\x99t 哈希处理，包含 [名称].[哈希值].[扩展名]

\n

\xe2\x80\xa2 我的 service-worker 是由根目录下的 registerServiceWorker 生成的 \xe2\x80\x99t。

\n

如何将我的暂存版本设置为与我在生产中使用的完全相同的版本？

\n

\n

我的网页包配置

\n

const path = require("path");\nconst webpack = require("webpack");\nconst WebpackAssetsManifest = require(\'webpack-assets-manifest\');\n\nmodule.exports = {\n  module: {\n    rules: [\n      {\n        test: /\\.scss$/,\n        use: ["vue-style-loader", "css-loader", "sass-loader"]\n      },\n      {\n        test: /\\.csv$/,\n        loader: \'csv-loader\',\n        options: {\n          dynamicTyping: true,\n          header: true,\n          skipEmptyLines: true\n        }\n      },\n      {\n        test: /\\.(csv|xlsx|xls)$/,\n        loader: \'file-loader\',\n        options: {\n          name: `files/[name].[ext]`\n        }\n      }\n    ],\n  },\n  output: {\n    path: path.join(__dirname, \'dist\'),\n    filename: \'[name]-[hash].js\',\n    chunkFilename: \'[id]-[chunkhash].js\',\n  },\n  plugins: [\n    new WebpackAssetsManifest({\n      publicPath: process.env.VUE_APP_FRONTEND_ROOT_URL,\n    }),\n    new webpack.DefinePlugin({\n      "API_URL": process.env.VUE_APP_FRONTEND_ROOT_URL\n    })\n  ],\n};\n

\n

Answer 1

经过三天的研究，我找到了解决方案，它是如此简单，让我抓狂。

在我的.env.staging文件中，我只需要重写NODE_ENV为生产，这样我就可以让我的 API 作为临时运行，并且我的生产配置将正常运行。

NODE_ENV=production