vue-cli3项目生产和测试环境分包后文件名和数量不一致

发布于 2022-09-12 22:30:46 字数 1521 浏览 12 评论 0

我用vue-cli3搭建的项目,在进行webpack按需分包之后,生产环境打包和测试环境打包出来的文件名和数量不一致:
image.png
对于生产环境的包,能正确的将文件按照页面分包打包出来,而测试环境的打包只能打包成1.js,2.js这种,并且少了chunk.js

我的vue.config.js配置如下:

chainWebpack: config => {
    config.resolve.alias
      .set("@", resolve("./src"))
      .set("assets", resolve("src/assets"))
      .set("components", resolve("src/components"))
      .set("containers", resolve("src/containers"))
      .set("service", resolve("src/service"))
      .set("utils", resolve("src/utils"))
      .set("store", resolve("src/store"))
      .set("config", resolve("src/config"))
      .set("pubilc", resolve("pubilc"));
    config.output.filename("static/js/[name].[hash].js").end();
  },
  configureWebpack: config => {
    config.optimization = {
      runtimeChunk: "single",
      splitChunks: {
        chunks: "all",
        maxInitialRequests: Infinity,
        minSize: 20000,
        cacheGroups: {
          vendor: {
            test: /[\\/]node_modules[\\/]/,
            name(module) {
              const packageName = module.context.match(
                /[\\/]node_modules[\\/](.*?)([\\/]|$)/
              )[1];
              return `npm.${packageName.replace("@", "")}`;
            },
          },
        },
      },
    };
  },

请问如何改能将测试环境的打包内容改成和生产环境一样呢?

补充:
package.json里面的命令:

"build": "vue-cli-service build",
"uat": "vue-cli-service build --mode test",

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

夏天碎花小短裙 2022-09-19 22:30:46

因为vue-clitest会有一些process.env.NODE_ENV === 'test'的判断,所以想和线上环境一样最简单的办法就是不用它的mode

"build": "vue-cli-service build",
"uat": "vue-cli-service build --mode mytest",
秋凉 2022-09-19 22:30:46
  • npx vue-cli-service inspect --mode test 使用这个命令看看配置差别
  • 如果你想保持一致的话,直接用同一个命令
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文