title: Angular npm start it is generating browser application bundles although the app is not in production
body: <p>I am dealing with an unexpected change at the npm start which it makes the server of Angular very slow.
  During <code>npm start</code> it is coming Generating browser applciation bundles (phase: building)... and it is taking to much time</p>
  <p>This is my package.json</p>
  <pre><code>    {
    &quot;name&quot;: &quot;project-name&quot;,
    &quot;version&quot;: &quot;0.0.0&quot;,
    &quot;scripts&quot;: {
      &quot;ng&quot;: &quot;ng&quot;,
      &quot;start&quot;: &quot;ng serve&quot;,
      &quot;build&quot;: &quot;ng build&quot;,
      &quot;test&quot;: &quot;ng test&quot;,
      &quot;lint&quot;: &quot;ng lint&quot;,
      &quot;e2e&quot;: &quot;ng e2e&quot;,
      &quot;postinstall&quot;: &quot;ngcc&quot;,
      &quot;proxy&quot;: &quot;http://localhost:5000&quot;
    },
    &quot;private&quot;: true,
    &quot;dependencies&quot;: {
      &quot;@angular/animations&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/cdk&quot;: &quot;^11.0.2&quot;,
      &quot;@angular/common&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/compiler&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/core&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/forms&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/material&quot;: &quot;^11.0.2&quot;,
      &quot;@angular/platform-browser&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/platform-browser-dynamic&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/router&quot;: &quot;~11.0.3&quot;,
      &quot;@fortawesome/angular-fontawesome&quot;: &quot;^0.8.1&quot;,
      &quot;@fortawesome/fontawesome-svg-core&quot;: &quot;^1.2.32&quot;,
      &quot;@fortawesome/free-brands-svg-icons&quot;: &quot;^5.15.1&quot;,
      &quot;@fortawesome/free-solid-svg-icons&quot;: &quot;^5.15.1&quot;,
      &quot;@ngx-translate/core&quot;: &quot;^12.1.2&quot;,
      &quot;@ngx-translate/http-loader&quot;: &quot;^4.0.0&quot;,
      &quot;@types/jwt-decode&quot;: &quot;^2.2.1&quot;,
      &quot;angular-cropperjs&quot;: &quot;^1.0.2&quot;,
      &quot;bootstrap&quot;: &quot;^4.5.3&quot;,
      &quot;chart.js&quot;: &quot;^2.9.3&quot;,
      &quot;core-js&quot;: &quot;^2.5.4&quot;,
      &quot;cropperjs&quot;: &quot;^1.5.9&quot;,
      &quot;express&quot;: &quot;^4.17.1&quot;,
      &quot;file-saver&quot;: &quot;^2.0.5&quot;,
      &quot;font-awesome&quot;: &quot;^4.7.0&quot;,
      &quot;google-libphonenumber&quot;: &quot;^3.2.14&quot;,
      &quot;intl-tel-input&quot;: &quot;^17.0.8&quot;,
      &quot;jquery&quot;: &quot;^3.5.1&quot;,
      &quot;jwt-decode&quot;: &quot;^2.2.0&quot;,
      &quot;lodash&quot;: &quot;^4.17.20&quot;,
      &quot;lodash-es&quot;: &quot;^4.17.15&quot;,
      &quot;moment&quot;: &quot;^2.28.0&quot;,
      &quot;ngx-awesome-uploader&quot;: &quot;^9.0.7&quot;,
      &quot;ngx-bootstrap&quot;: &quot;^6.1.0&quot;,
      &quot;ngx-color-picker&quot;: &quot;^10.1.0&quot;,
      &quot;ngx-gravatar&quot;: &quot;^10.0.0&quot;,
      &quot;ngx-image-cropper&quot;: &quot;^3.2.1&quot;,
      &quot;ngx-intl-tel-input&quot;: &quot;^3.0.3&quot;,
      &quot;ngx-quill&quot;: &quot;^13.0.1&quot;,
      &quot;ngx-sharebuttons&quot;: &quot;^8.0.5&quot;,
      &quot;popper.js&quot;: &quot;^1.16.1&quot;,
      &quot;quill&quot;: &quot;^1.3.7&quot;,
      &quot;quill-emoji&quot;: &quot;^0.1.8&quot;,
      &quot;quill-image-resize-module&quot;: &quot;^3.0.0&quot;,
      &quot;quill-mention&quot;: &quot;^3.0.0&quot;,
      &quot;rxjs&quot;: &quot;~6.5.4&quot;,
      &quot;tslib&quot;: &quot;^2.0.0&quot;,
      &quot;zone.js&quot;: &quot;~0.10.2&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@angular-devkit/build-angular&quot;: &quot;^0.1100.3&quot;,
      &quot;@angular/cli&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/compiler-cli&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/language-service&quot;: &quot;~11.0.3&quot;,
      &quot;@angular/localize&quot;: &quot;^11.0.3&quot;,
      &quot;@types/file-saver&quot;: &quot;^2.0.1&quot;,
      &quot;@types/jasmine&quot;: &quot;~3.6.0&quot;,
      &quot;@types/jasminewd2&quot;: &quot;~2.0.3&quot;,
      &quot;@types/node&quot;: &quot;^12.11.1&quot;,
      &quot;codelyzer&quot;: &quot;^6.0.0&quot;,
      &quot;jasmine-core&quot;: &quot;~3.6.0&quot;,
      &quot;jasmine-spec-reporter&quot;: &quot;~5.0.0&quot;,
      &quot;karma&quot;: &quot;~5.0.0&quot;,
      &quot;karma-chrome-launcher&quot;: &quot;~3.1.0&quot;,
      &quot;karma-coverage-istanbul-reporter&quot;: &quot;~3.0.2&quot;,
      &quot;karma-jasmine&quot;: &quot;~4.0.0&quot;,
      &quot;karma-jasmine-html-reporter&quot;: &quot;^1.5.0&quot;,
      &quot;protractor&quot;: &quot;~7.0.0&quot;,
      &quot;ts-node&quot;: &quot;~7.0.0&quot;,
      &quot;tslint&quot;: &quot;~6.1.0&quot;,
      &quot;typescript&quot;: &quot;&gt;=4.0 &lt;4.1&quot;
    },
    &quot;description&quot;: &quot;This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.1.&quot;,
    &quot;main&quot;: &quot;index.js&quot;,
    &quot;repository&quot;: {
      &quot;type&quot;: &quot;git&quot;,
      &quot;url&quot;: &quot;git+https://github.com/username/career.git&quot;
    },
    &quot;author&quot;: &quot;&quot;,
    &quot;license&quot;: &quot;ISC&quot;,
    &quot;bugs&quot;: {
      &quot;url&quot;: &quot;https://github.com/username/career/issues&quot;
    },
    &quot;homepage&quot;: &quot;https://github.com/username/career#readme&quot;
  }
  </code></pre>
  <p>And this is my <code>angular.json</code></p>
  <pre><code>{
    &quot;$schema&quot;: &quot;./node_modules/@angular/cli/lib/config/schema.json&quot;,
    &quot;version&quot;: 1,
    &quot;newProjectRoot&quot;: &quot;projects&quot;,
    &quot;projects&quot;: {
      &quot;my-project-ng&quot;: {
        &quot;root&quot;: &quot;&quot;,
        &quot;sourceRoot&quot;: &quot;src&quot;,
        &quot;projectType&quot;: &quot;application&quot;,
        &quot;prefix&quot;: &quot;app&quot;,
        &quot;schematics&quot;: {
          &quot;@schematics/angular:component&quot;: {
            &quot;style&quot;: &quot;scss&quot;
          }
        },
        &quot;architect&quot;: {
          &quot;build&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:browser&quot;,
            &quot;options&quot;: {
              &quot;allowedCommonJsDependencies&quot;: [
                &quot;lodash&quot;,
                &quot;jwt-decode&quot;
             ],
              &quot;aot&quot;: true,
              &quot;outputPath&quot;: &quot;dist/my-project-ng&quot;,
              &quot;index&quot;: &quot;src/index.html&quot;,
              &quot;main&quot;: &quot;src/main.ts&quot;,
              &quot;polyfills&quot;: &quot;src/polyfills.ts&quot;,
              &quot;tsConfig&quot;: &quot;src/tsconfig.app.json&quot;,
              &quot;assets&quot;: [
                &quot;src/favicon.ico&quot;,
                &quot;src/assets&quot;
              ],
              &quot;styles&quot;: [
                &quot;./node_modules/ngx-bootstrap/datepicker/bs-datepicker.css&quot;,
                &quot;./node_modules/@angular/material/prebuilt-themes/indigo-pink.css&quot;,
                &quot;./node_modules/font-awesome/css/font-awesome.css&quot;,
                &quot;./node_modules/intl-tel-input/build/css/intlTelInput.css&quot;,
                &quot;./node_modules/bootstrap/dist/css/bootstrap.min.css&quot;,
                &quot;./node_modules/cropperjs/dist/cropper.min.css&quot;,
                &quot;./node_modules/quill-emoji/dist/quill-emoji.css&quot;,
                &quot;src/styles.scss&quot;
              ],
              &quot;scripts&quot;: [
                &quot;node_modules/jquery/dist/jquery.min.js&quot;,
                &quot;node_modules/bootstrap/dist/js/bootstrap.bundle.min.js&quot;,
                &quot;node_modules/cropperjs/dist/cropper.js&quot;,
                &quot;node_modules/popper.js/dist/umd/popper.min.js&quot;
              ]
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;fileReplacements&quot;: [
                  {
                    &quot;replace&quot;: &quot;src/environments/environment.ts&quot;,
                    &quot;with&quot;: &quot;src/environments/environment.prod.ts&quot;
                  }
                ],
                &quot;optimization&quot;: true,
                &quot;outputHashing&quot;: &quot;all&quot;,
                &quot;sourceMap&quot;: false,
                &quot;extractCss&quot;: true,
                &quot;namedChunks&quot;: false,
                &quot;aot&quot;: true,
                &quot;extractLicenses&quot;: true,
                &quot;vendorChunk&quot;: false,
                &quot;buildOptimizer&quot;: true,
                &quot;budgets&quot;: [
                  {
                    &quot;type&quot;: &quot;initial&quot;,
                    &quot;maximumWarning&quot;: &quot;2mb&quot;,
                    &quot;maximumError&quot;: &quot;5mb&quot;
                  },
                  {
                    &quot;type&quot;: &quot;anyComponentStyle&quot;,
                    &quot;maximumWarning&quot;: &quot;6kb&quot;
                  }
                ]
              }
            }
          },
          &quot;serve&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:dev-server&quot;,
            &quot;options&quot;: {
              &quot;browserTarget&quot;: &quot;my-project-ng:build&quot;
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;browserTarget&quot;: &quot;my-project-ng:build:production&quot;
              }
            }
          },
          &quot;extract-i18n&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:extract-i18n&quot;,
            &quot;options&quot;: {
              &quot;browserTarget&quot;: &quot;my-project-ng:build&quot;
            }
          },
          &quot;test&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:karma&quot;,
            &quot;options&quot;: {
              &quot;main&quot;: &quot;src/test.ts&quot;,
              &quot;polyfills&quot;: &quot;src/polyfills.ts&quot;,
              &quot;tsConfig&quot;: &quot;src/tsconfig.spec.json&quot;,
              &quot;karmaConfig&quot;: &quot;src/karma.conf.js&quot;,
  
              &quot;styles&quot;: [
                &quot;./node_modules/bootstrap/dist/css/bootstrap.min.css&quot;,
                &quot;./node_modules/ngx-bootstrap/datepicker/bs-datepicker.css&quot;,
                &quot;./node_modules/@angular/material/prebuilt-themes/indigo-pink.css&quot;,
                &quot;src/styles.scss&quot;
              ],
              &quot;scripts&quot;: [],
              &quot;assets&quot;: [
                &quot;src/favicon.ico&quot;,
                &quot;src/assets&quot;
              ]
            }
          },
          &quot;lint&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:tslint&quot;,
            &quot;options&quot;: {
              &quot;tsConfig&quot;: [
                &quot;src/tsconfig.app.json&quot;,
                &quot;src/tsconfig.spec.json&quot;
              ],
              &quot;exclude&quot;: [
                &quot;**/node_modules/**&quot;
              ]
            }
          }
        }
      },
      &quot;my-project-ng-e2e&quot;: {
        &quot;root&quot;: &quot;e2e/&quot;,
        &quot;projectType&quot;: &quot;application&quot;,
        &quot;prefix&quot;: &quot;&quot;,
        &quot;architect&quot;: {
          &quot;e2e&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:protractor&quot;,
            &quot;options&quot;: {
              &quot;protractorConfig&quot;: &quot;e2e/protractor.conf.js&quot;,
              &quot;devServerTarget&quot;: &quot;my-project-ng:serve&quot;
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;devServerTarget&quot;: &quot;my-project-ng:serve:production&quot;
              }
            }
          },
          &quot;lint&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:tslint&quot;,
            &quot;options&quot;: {
              &quot;tsConfig&quot;: &quot;e2e/tsconfig.e2e.json&quot;,
              &quot;exclude&quot;: [
                &quot;**/node_modules/**&quot;
              ]
            }
          }
        }
      }
    },
    &quot;defaultProject&quot;: &quot;my-project-ng&quot;,
    &quot;cli&quot;: {
      &quot;analytics&quot;: false
    }
  }
  </code></pre>
  <p>And then it is adding some weird warnings.</p>
  <pre><code>node_modules\canvg\lib\index.es.js depends on '@babel/runtime-corejs3/regenerator'. CommonJS or AMD dependencies can cause optimization bailouts.
  </code></pre>
  <p>I tried as the <code>Angular</code> page it says <a href="https://angular.io/guide/build#configuring-commonjs-dependencies" rel="nofollow noreferrer">https://angular.io/guide/build#configuring-commonjs-dependencies</a>
  but it didnt help, I do see the messages again.</p>
  <p>And the time duration of the npm <code>npm start</code> &amp; <code>ng serve</code> it is more than 1 minute.</p>