0

We have requirement to hide environment variables which are comes together in build files in angular application.

We found solution using @angular-builders/custom-webpack and dotenv libraries when gone through google search.

Below is project info,

**Angular version - 17.3.0

SSR - Enabled**

We use builder application from @angular-devkit/build-angular as it provides CSR and SSR features.

There is no equivalent builder available in @angular-builders/custom-webpack for @angular-devkit/build-angular:application

Do we have any other libraries same like above or how to achieve same using @angular-builders/custom-webpack?

Below is agular.json we are using,

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "my-web-application": {
      "projectType": "application",
      "schematics": {
        "@schematics/angular:component": {
          "style": "scss",
          "standalone": false
        },
        "@schematics/angular:directive": {
          "standalone": false
        },
        "@schematics/angular:pipe": {
          "standalone": false
        }
      },
      "root": "",
      "sourceRoot": "src",
      "prefix": "app",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": {
              "base":  "dist/my-web-application",
              "browser": "."
            },
            "index": "src/index.html",
            "browser": "src/main.ts",
            "polyfills": [
              "zone.js"
            ],
            "tsConfig": "tsconfig.app.json",
            "inlineStyleLanguage": "scss",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.scss"
            ],
            "server": "src/main.server.ts",
            "prerender": false,
            "ssr": {
              "entry": "server.ts"
            },
            "stylePreprocessorOptions": {
              "includePaths": [
                "node_modules/"
              ]
            }
          },
          "configurations": {
            "production": {
              "index": {
                "input": "src/index.prod.html",
                "output": "index.html"
              },
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "6mb",
                  "maximumError": "7mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "19kb",
                  "maximumError": "20kb"
                }
              ],
              "outputHashing": "all"
            },
            "development": {
              "optimization": false,
              "extractLicenses": false,
              "sourceMap": true
            },
            "noSsr": {
              "ssr": false,
              "prerender": false
            }
          },
          "defaultConfiguration": "production"
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "configurations": {
            "production": {
              "buildTarget": "my-web-application:build:production,noSsr"
            },
            "development": {
              "buildTarget": "my-web-application:build:development,noSsr"
            }
          },
          "defaultConfiguration": "development"
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "buildTarget": "my-web-application:build"
          }
        }
      }
    }
  }
}

1 Answer 1

0

You're looking for @angular-builders/custom-esbuild.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.