Also guys, someone tried this with angular-universal? If I use: --deploy-url /myPath/ I'm receiving this erros in node... Unable to locate stylesheet: /var/www/html/dist/browser/**myPath**/styles.16d89a3cd69123f2ba9c.css

Also the url set to the assets seems to be wrong..

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Can you please run npm ls @angular/cdk?

Another use case for pre-build script is a replacement for fileReplacements. Prior to Angular 11 components could be built with configuration dependent templates. The removal blocks the upgrade path from 10 to 11. See https://github.com/angular/angular-cli/issues/19390#issuecomment-745283960, for example. I have not found a workaround

🐞 Bug report

I am updating to angular 11.2.14 and receive the following error.

🔥 Exception or Error

npm ERR! Found: @angular/cdk@undefined
npm ERR! node_modules/@angular/cdk
npm ERR!   dev @angular/cdk@"^11.2.14" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/cdk@"^11.0.0" from @angular/[email protected]
npm ERR! node_modules/@angular/flex-layout
npm ERR!   dev @angular/flex-layout@"11.0.0-beta.33" from the root project

The error was reported once in #10167 but was closed due to the lack of feedback.

Is this a regression?

Yes, the previous version in which this bug was not present was: 11.1.0

Description

Content of package.json:

    "@angular-builders/custom-webpack": "11.2.14",
    "@angular-devkit/build-angular": "11.2.14",
    "@angular/animations": "11.2.14",
    "@angular/cdk": "^11.2.14",
    "@angular/cli": "11.2.14",
    "@angular/common": "11.2.14",
    "@angular/compiler": "11.2.14",
    "@angular/compiler-cli": "11.2.14",
    "@angular/core": "11.2.14",
    "@angular/flex-layout": "11.0.0-beta.33",
    "@angular/forms": "11.2.14",
    "@angular/language-service": "11.2.14",
    "@angular/material": "11.2.14",
    "@angular/platform-browser": "11.2.14",
    "@angular/platform-browser-dynamic": "11.2.14",
    "@angular/router": "11.2.14",

🌍 Your Environment

<pre><code> Angular CLI: 12.0.4 Node: 16.2.0 Package Manager: npm 7.15.0 OS: darwin arm64

Angular: <error> ... animations, cdk, common, compiler, compiler-cli, core ... flex-layout, forms, language-service, material ... platform-browser, platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.1200.4 (cli-only) @angular-devkit/build-angular <error> @angular-devkit/core 12.0.4 (cli-only) @angular-devkit/schematics 12.0.4 (cli-only) @angular/cli 12.0.4 (cli-only) @schematics/angular 12.0.4 (cli-only) rxjs 6.6.7 (cli-only) typescript <error> webpack <error> </code></pre>

Following up, I was able to rename my .npmrc and do the upgrade with the connection to normal npm registry. I opened a ticket with the team in charge of artifactory at my company because previously I was able to do upgrades with no issue.

It would be great to have this in place, or some clarification on what's the best approach to serve an index.html that can have different dir attribute values.

"dependencies": {
    "@angular/animations": "12.0.2",
    "@angular/cdk": "12.0.2",
    "@angular/common": "12.0.2",
    "@angular/compiler": "12.0.2",
    "@angular/core": "12.0.2",
    "@angular/forms": "12.0.2",
    "@angular/platform-browser": "12.0.2",
    "@angular/platform-browser-dynamic": "12.0.2",
    "@angular/platform-server": "12.0.2",
    "@angular/router": "12.0.2",
    "@auth0/angular-jwt": "5.0.2",
....
...
 },
  "devDependencies": {
    "@angular-devkit/build-angular": "12.0.2",
    "@angular-eslint/builder": "12.1.0",
    "@angular-eslint/eslint-plugin": "12.1.0",
    "@angular-eslint/eslint-plugin-template": "12.1.0",
    "@angular-eslint/schematics": "12.1.0",
    "@angular-eslint/template-parser": "12.1.0",
    "@angular/cli": "12.0.2",
    "@angular/compiler-cli": "12.0.2",
    "@angular/language-service": "12.0.2",
    "@types/node": "15.0.2",
    "@typescript-eslint/eslint-plugin": "4.26.0",
    "@typescript-eslint/parser": "4.26.0",
    "eslint": "7.28.0",
    "eslint-plugin-import": "2.23.4",
    "eslint-plugin-jsdoc": "35.1.3",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "ts-node": "9.1.1",
    "typescript": "4.0.7",
    "webpack-bundle-analyzer": "4.4.2"
  }

└─┬ @angular-devkit/[email protected] ├─┬ @angular-devkit/[email protected] │ └── [email protected] deduped ├─┬ @angular-devkit/[email protected] │ └── [email protected] deduped ├─┬ @ngtools/[email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ ├─┬ [email protected] │ │ └── [email protected] deduped │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped └── [email protected]

After migrating from angular 11 to 12 started to give this error.

Closing due to lack of feedback from the issue author.

I had the same problem, where the ng build command would fail with OOM errors (Angular 12.0.4). It seems to be fixed after using the following properties in angular.json (meaning the build finished, but I'm not sure if the problem is fixed or if it will reappear; I will come back with an update if it fails again):

"outputHashing": "all",
"namedChunks": true,
"extractLicenses": false,
"vendorChunk": true,
"buildOptimizer": false,
"sourceMap": true

OOM errors are also thrown by ng serve after a while. It is also noticeably slower than previous Angular versions. It also seems to be triggering more recompiles than previous versions (i.e. not only on file save), but I think this behavior is intended?

ng update like npm has logic to read and parse the NPMRC to request packages via https://github.com/npm/npm-registry-fetch so that it can do network requests to the private/public NPM registries.

• //localhost:4873/ needs to be replaced by your registry url, and no it doesn't need a port.
• XXXX== needs to be replaced with your encrypted authentication token (Can be obtained when login via npm login)

At the point the easilest thing to do in your case would be to do the following

• Update D:\code\linkener-applications\.npmrc to the below:

registry=https://<registry>

• Delete D:\code\linkener-applications\linkener-photovoltaic-calculator\.npmrc

• Update C:\Users\juanj\.npmrc to contain the below;

//<registry>/:_auth="XXXXX"

Alternatively and recommended use npm login --registry=https://<registry> instead of the last step.

This uses the experimental executeModule feature which was introduced in Webpack 5.33.2.

See: https://webpack.js.org/configuration/experiments/#experimentsexecutemodule

Solves the following regression in Angular 12: https://github.com/angular/angular-cli/issues/21129

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

I'm not getting what this has to do with the Angular update, with previous versions I had no problem. If my password is abc123 Would the password be abc123== or just abc123? Should the port be 4873, or can it be another?

I had this problem and found out that it was because of an "error" in my angular.json file, does not have to be the same reason here but check to make sure that you do not have any "assets" in your angular.json that does not exist (I specifically had one of the glob pattern variety, not sure if it would do the same with normal assets)

Thanks a lot @Ristaaf, this fixed the issue in our Angular application.

So, I did look into this and using the below should fix the below issue.

Adding the below info in your project NPMC.

//localhost:4873/:_authToken="XXXX==" # Declare the proxy and it's auth.
registry=http://localhost:4873/ # Configure to use the proxy.

Alternatively you can use npm login --registry=http://localhost:4873/ so that the proxy and auth are configured globally and in your project just add the an NPMRC which uses the proxy.

registry=http://localhost:4873/ # Configure to use the proxy.

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
@babel/core (source)	7.14.5 -> 7.14.6
@babel/runtime (source)	7.14.5 -> 7.14.6
@typescript-eslint/eslint-plugin	4.26.1 -> 4.27.0
@typescript-eslint/parser	4.26.1 -> 4.27.0
postcss (source)	8.3.2 -> 8.3.4
sass	1.34.1 -> 1.35.0
webpack	5.38.1 -> 5.39.0

Release Notes

<details> <summary>babel/babel</summary>

v7.14.6

Compare Source

:bug: Bug Fix

• babel-plugin-transform-spread
  • #​13459 babel-plugin-transform-spread add missing argument in build calls (@​zxbodya)
  • #​13439 Correctly transform spreads of arrays with holes (@​nicolo-ribaudo)
• babel-helpers, babel-plugin-transform-destructuring, babel-plugin-transform-modules-commonjs
  • #​13444 fix destructuring of empty string (@​lala7573)
• babel-helper-create-class-features-plugin, babel-plugin-proposal-class-properties
  • #​13429 fix: reference to class expression in private method (@​lala7573)
• babel-parser
  • #​13428 [ts] Support override modifiers for parameter properties (@​sosukesuzuki)
  • #​13449 Disallow JSX tag forming after TS non-null assertion (@​JLHwung)

:house: Internal

• #​13423 Faster babel build (@​JLHwung)

:running_woman: Performance

• babel-parser
  • #​13453 Faster readRegexp (@​JLHwung)

</details>

<details> <summary>typescript-eslint/typescript-eslint</summary>

v4.27.0

Compare Source

Bug Fixes

• eslint-plugin: allow explicit any for no-unsafe-return (#​3498) (b15a2b2)
• typescript-estree: allow providing more one than one existing program in config (#​3508) (4f1806e)
• typescript-estree: support override modifier for parameter property (#​3485) (33b9f69)

Features

• ast-spec: specify LogicalExpression's operator type (#​3497) (9e343fd)
• ast-spec: specify PunctuatorToken's value type (#​3496) (fdb1d81)
• eslint-plugin: [prefer-literal-enum-member] add allowBitwiseExpressions option (#​3515) (288092a)
• typescript-estree: add opt-in inference for single runs and create programs for projects up front (#​3512) (06c2d9b)
• allow user to provide TS program instance in parser options (#​3484) (e855b18)

4.26.1 (2021-06-07)

Bug Fixes

• eslint-plugin: [prefer-includes] ignore option chaining before indexOfs (#​3432) (bf0cddb)
• eslint-plugin: fix doc url generation (#​3475) (fc5f171), closes #​3473

</details>

<details> <summary>postcss/postcss</summary>

v8.3.4

Compare Source

• Fixed broken AST detection.

v8.3.3

Compare Source

• Fixed broken AST on postcss dependency duplication in custom parsers.

</details>

<details> <summary>sass/dart-sass</summary>

v1.35.0

Compare Source

• Fix a couple bugs that could prevent some members from being found in certain files that use a mix of imports and the module system.

• Fix incorrect recommendation for migrating division expressions that reference namespaced variables.

JS API

• Add a quietDeps option which silences compiler warnings from stylesheets loaded through importers and load paths.

• Add a verbose option which causes the compiler to emit all deprecation warnings, not just 5 per feature.

</details>

<details> <summary>webpack/webpack</summary>

v5.39.0

Compare Source

Features

• allow lazy compilation for import() context (import with expression)

Bugfixes

• fix respecting cache.allowCollectingMemory
• fix cli loading after installing it
• fix initial list of non-js chunks that are flagged as already loaded

Performance

• remove unnecessary Error.captureStackTrace from webpack errors

</details>

Configuration

📅 Schedule: "after 10pm every weekday,before 4am every weekday,every weekend" in timezone America/Tijuana.

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

👻 Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.

• [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box.

This PR has been generated by WhiteSource Renovate. View repository job log here.

@Supratentorial / @restfulhead can anyone of you please share a reproduction? Without this it would be hard to get to the bottom of this.

I'm getting the same issue. Seems to be resolved with disabling generation of source maps.

thank you for this post. though how has this not been updated yet. it's been a week.... this is bound to cause more harm than anything else. you literally have a compiler warning encouraging people to change their builds. Reading the release notes was more harmful than ever this time...

That is probably from the time were Angular CLI didn’t have a monorepo/multi-project concept were libraries and apps can live side my side in the same got repo.

An alternative to npm linking can be using TypeScript configuration path mappings.

{
  "compilerOptions": {
    // ...
    // paths are relative to `baseUrl` path.
    "paths": {
      "@mylib/*": [
       “../../my-lib/dist/*",
       “node_modules/my-lib/*
      ]
    }
  }
}

@alan-agius4 Using npm link is suggested here: https://angular.io/guide/creating-libraries#linked-libraries Is there any different way to achieve similar effect?