Vuecli配置用于开发和生产

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

您可以使用env变量。建立就是生产，服务就是发展。

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

}