Angular-builders: 2 different webpack configs for production and non-production or variable

[stepet80]

We would like to have one webpack config for the regular build and another one for the production build.

An alternative would be to be able to have a variable in the webpack (e.g. process.production) that we can use to check if it is a normal build or production build.

How can we do this with angular-builders?

[just-jeb]

Yes, you totally can. You should use configuration section in _angular.json_.
It would look like this:

   "architect": {
        "build": {
          "builder": "@angular-builders/custom-webpack:browser",
          "options": {
            "outputPath": "dist/electron-angular-native",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.png",
              "src/assets"
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
                "customWebpackConfig": {
                    "path": "./prod-webpack.config.js"
                },
            },
            "development": {
                "customWebpackConfig": {
                    "path": "./dev-webpack.config.js"
                },
            }
          }
        },

And then you run it like this:
ng build --configuration=production or ng build --configuration=development

[stepet80]

It work's like this. Thanks.