CODEWITHSUNDEEP
angularwebpackangular-cli-v6
Unknown developer
Unknown developer

Reputation: 5930

Angular CLI 6.0.1 how to control dev environment and webpack

This is part of angular.json:

"configurations": {
            "production": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }

What I want to do is to control the development environment. For example change sourceMap to false and I do not want to do that by adding parameters to ng build. Is there any equivalent to production inside angular.json which will refer to development?

And something very important: In Angular-CLI 6 there is no ng eject! How then, is it possible to see and modify webpack.config.js ?

Upvotes: 4

Views: 1847

Answers (2)

Никита Середа
Никита Середа

Reputation: 2084

I found webpack config here: node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/common.js

Upvotes: 0

David
David

Reputation: 34435

Default settings for all environments are configured in the architect > build > options property

 "projects": {
    "MyProject": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",

            //Add settings here
            "sourceMap": false,
             "fileReplacements": [
                {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.anotherdevenv.ts"
                }
            ]

These settings are used as is for the dev env, so you can modify this (but this will impact other environments if they do not override the specified setting)

You can also create your own "development" configuration (by copying the production conf for instance, and changing depending en your needs), and specify in that conf your setting specific to the dev environment. Then run the command below

ng serve -c development

The eject command is temporarily disabled, but it should be added back soon according to a comment by a core member of angular cli team (https://github.com/angular/angular-cli/issues/10945)

Upvotes: 6

Related Questions