用于开发和生产的 Vue Cli 配置

Question

我想在 vuecli vue.config.js 中使用不同的 webpack 配置进行生产和开发

目前在我的项目中，我有一个 vue.config.js 有

module.exports = {
  configureWebpack: {
    optimization: {
        splitChunks: {
            ...splint chunks configuration
        }
    }
  }

}

以上在开发和生产中运行夹板块配置。如何区分不同的 webpack 开发配置和不同的生产配置。

我也试过添加

devServer: {
    configureWebpack: {
        optimization: {
            splitChunks: false
        }
    }
},

但这仍然不起作用

在我的 package.json 中有

{
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"

}

Answer 1

您可以使用环境变量。构建即生产，服务即开发。

module.exports = {
  configureWebpack: {
    optimization: {
        splitChunks: process.env.NODE_ENV === "development" ? false : true //or just process.env.NODE_ENV === "production"
    }
  }

}