Update to angular 11 #874

sonallux · 2020-11-16T08:10:00Z

PR Checklist

Please check if your PR fulfills the following requirements:

Tests for the changes have been added (for bug fixes / features): no need for changes of the tests
Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[ ] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[x] Other... Please describe: Update to Angular 11

What is the current behavior?

Peer dependency warnings when installing the builders in an angular 11 project.

Issue Number: #873

What is the new behavior?

No warnings about peer dependencies. This also fixes the failing dependabot PRs #870 #871 and #872.

Does this PR introduce a breaking change?

[x] Yes
[ ] No

Other information

BREAKING CHANGE: update to angular 11

closes #854

sonallux · 2020-11-16T21:30:14Z

@just-jeb the PR is ready for review.

just-jeb · 2020-11-17T14:59:44Z

@all-contributors please add @jsone-studios for issues and code.

allcontributors · 2020-11-17T14:59:54Z

@just-jeb

I've put up a pull request to add @jsone-studios! 🎉

just-jeb

Great job! I've only had a few questions, please address them and I'll merge.

just-jeb · 2020-11-17T15:03:31Z

packages/jest/examples/multiple-apps/package.json

@@ -7,41 +7,39 @@
    "build": "yarn ng build",
    "test": "yarn ng test",
    "lint": "yarn ng lint",
-    "e2e": "yarn ng e2e",
-    "postinstall": "ngcc"


Why the ngcc postinstall has been removed?

postinstall is no longer recommended (it it faster to process libs that application will import than whole node_modules)
https://github.com/angular/angular/blob/master/CHANGELOG.md#910-2020-03-25

ngcc produced a warning because of a "solution-style" tsconfig. When I tried to resolve the warning, I found the PR angular/angular#38003 introducing it and found this comment of an angular team member:

Currently our docs do not recommend running ngcc as a postinstall hook, except for a particular scenario related to Angular Universal: https://angular.io/guide/ivy#ivy-and-universalapp-shell.

I tried without the ngcc postinstall and it did work without any issues. Therefore I have removed it.

Interesting... The ngcc here was rather for example than because of actual need. The thing is that Angular CLI builders (including Karma) use Angular tool chain on order to prepare files for tests, while Jest doesn't. This means that there is no way to run ngcc programmatically only on libraries that you need (because ts-jest doesn't utilize Angular tool chain).
Well, there is a way but it's very complicated and requires major rewrite of ts-jest.
Hence, if your app uses incompatible libs (that were not compiled with Ivy) you have to run ngcc manually on these libs.
I guess we can remove it from the examples and add to the docs, this should be enough.

just-jeb · 2020-11-17T15:04:08Z

packages/jest/examples/simple-app/package.json

@@ -7,40 +7,39 @@
    "build": "yarn ng build",
    "test": "yarn ng test",
    "lint": "yarn ng lint",
-    "e2e": "yarn ng e2e",
-    "postinstall": "ngcc"


Why the ngcc postinstall has been removed?

postinstall is no longer recommended (it it faster to process libs that application will import than whole node_modules)
https://github.com/angular/angular/blob/master/CHANGELOG.md#910-2020-03-25

See my other comment

just-jeb · 2020-11-17T15:05:01Z

packages/jest/package.json

-    "jest-preset-angular": "^8.2.1",
+    "@angular-devkit/architect": ">=0.1100.0 < 0.1200.0",
+    "@angular-devkit/core": "^11.0.0",
+    "jest-preset-angular": "^8.3.2",


I suppose it closes #854 ?

Yes, it does. I have mentioned it in the commit message but forgot to mention it in the PR.

This reverts commit 0db025d.

closes #854, closes #873

just-jeb · 2020-11-17T21:18:17Z

Sorry guys I'm reverting it for now, webpack-merge update (#819) should be part of this major release since it's a breaking change.
I'll try to update it tomorrow or the day after, need to make sure that all the use cases are covered, since smart strategy has been deprecated.
You're welcome to take a look at this too if you feel like doing it.

just-jeb · 2020-11-17T21:47:33Z

The update actually looks pretty straight forward, but requires some work:

smartStrategy should be replaced with mergeWithRules
Schema has to be updated (also the examples that use strategies)
Docs, tests and migration guide need to be updated as well

just-jeb · 2020-11-17T21:58:04Z

Giving it a second thought - I'm gonna release a beta version to let you guys update and will update the webpack-merge afterwards before I release the stable version.
That being said you're still welcome to make a PR in order to speed things up 😄
And thanks again for the great work!

just-jeb · 2020-11-17T22:13:39Z

You can try it now with @next tag.

kmaraz · 2020-11-25T23:41:54Z

I have tried to install custom webpack builder with @next tag. A few observations:
I needed to install yarn add parse5-htmlparser2-tree-adapter
also yarn add postcss-loader
and after running ng run app:serve I've got this error:

ERROR in ./src/styles.scss
Module build failed (from /home/xxx/projects/app/node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from /home/xxx/projects/app/node_modules/postcss-loader/dist/cjs.js):
ValidationError: Invalid options object. PostCSS Loader has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'plugins'. These properties are valid:
   object { postcssOptions?, execute?, sourceMap? }
    at validate (/home/xxx/projects/app/node_modules/schema-utils/dist/validate.js:104:11)
    at Object.loader (/home/xxx/projects/app/node_modules/postcss-loader/dist/index.js:43:29)
    at /home/xxx/projects/app/node_modules/webpack/lib/NormalModule.js:316:20
    at /home/xxx/projects/app/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /home/xxx/projects/app/node_modules/loader-runner/lib/LoaderRunner.js:233:18

ERROR in Module build failed (from /home/xxx/projects/app/node_modules/postcss-loader/dist/cjs.js):
ValidationError: Invalid options object. PostCSS Loader has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'plugins'. These properties are valid:
   object { postcssOptions?, execute?, sourceMap? }
 - options.sourceMap should be a boolean.
   -> Enables/Disables generation of source maps (https://github.com/postcss/postcss-loader#sourcemap)
    at validate (/home/xxx/projects/app/node_modules/schema-utils/dist/validate.js:104:11)
    at Object.loader (/home/xxx/projects/app/node_modules/postcss-loader/dist/index.js:43:29)

kmaraz · 2020-11-29T22:01:53Z

@just-jeb sorry for notifying you, but I would like to know, if you think this is problem on my part or it should be solved by you. Thank you very much 👍

just-jeb · 2020-12-08T17:48:37Z

@kmaraz I'm not familiar with your specific setup but it does work for most of people so I would assume the problem is on your side. Would you mind sharing your angular.json? Do you use experimental Webpack 5 support? Can you try removing package lock and node_module and installing everything from scratch?

kmaraz · 2020-12-09T12:34:36Z

I have tested it on a different machine and it worked like a charm :) Thank you for your help.

chore(deps): bump angular-devkit from 10 to 11

b2b5327

sonallux mentioned this pull request Nov 16, 2020

Update to angular 11 #873

Closed

chore(deps)!: update examples to angular 11

1b87cfd

BREAKING CHANGE: update to angular 11

sonallux changed the title ~~chore(deps): bump angular-devkit from 10 to 11~~ WIP: Update to angular 11 Nov 16, 2020

sonallux marked this pull request as draft November 16, 2020 12:38

jsone-studios added 2 commits November 16, 2020 14:13

chore(deps): bump jest-preset-angular

841cd14

closes #854

docs: update README.md and MIGRAION.md

df62efc

sonallux marked this pull request as ready for review November 16, 2020 21:26

sonallux changed the title ~~WIP: Update to angular 11~~ Update to angular 11 Nov 16, 2020

allcontributors bot mentioned this pull request Nov 17, 2020

docs: add jsone-studios as a contributor #875

Merged

Update MIGRATION.MD

e973739

just-jeb reviewed Nov 17, 2020

View reviewed changes

just-jeb merged commit 0db025d into just-jeb:master Nov 17, 2020

sonallux deleted the angular-11 branch November 17, 2020 18:28

just-jeb added a commit that referenced this pull request Nov 17, 2020

Revert "chore(version)!: update to angular 11 (#874)"

63cd4cd

This reverts commit 0db025d.

just-jeb pushed a commit that referenced this pull request Nov 17, 2020

chore(deps)!: update to angular 11 (#874)

e0900dd

closes #854, closes #873

just-jeb mentioned this pull request Nov 17, 2020

Revert "Update to angular 11" #878

Merged

just-jeb mentioned this pull request Nov 19, 2020

feat(webpack5): simplify dependencies resolution when opt-in #853

Closed

2 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update to angular 11 #874

Update to angular 11 #874

sonallux commented Nov 16, 2020 •

edited

Loading

sonallux commented Nov 16, 2020

just-jeb commented Nov 17, 2020

allcontributors bot commented Nov 17, 2020

just-jeb left a comment

just-jeb Nov 17, 2020

SebastianPodgajny Nov 17, 2020

sonallux Nov 17, 2020

just-jeb Nov 17, 2020

just-jeb Nov 17, 2020

SebastianPodgajny Nov 17, 2020

sonallux Nov 17, 2020

just-jeb Nov 17, 2020

sonallux Nov 17, 2020

just-jeb commented Nov 17, 2020

just-jeb commented Nov 17, 2020

just-jeb commented Nov 17, 2020 •

edited

Loading

just-jeb commented Nov 17, 2020

kmaraz commented Nov 25, 2020

kmaraz commented Nov 29, 2020

just-jeb commented Dec 8, 2020

kmaraz commented Dec 9, 2020

Update to angular 11 #874

Update to angular 11 #874

Conversation

sonallux commented Nov 16, 2020 • edited Loading

PR Checklist

PR Type

What is the current behavior?

What is the new behavior?

Does this PR introduce a breaking change?

Other information

sonallux commented Nov 16, 2020

just-jeb commented Nov 17, 2020

allcontributors bot commented Nov 17, 2020

just-jeb left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

just-jeb commented Nov 17, 2020

just-jeb commented Nov 17, 2020

just-jeb commented Nov 17, 2020 • edited Loading

just-jeb commented Nov 17, 2020

kmaraz commented Nov 25, 2020

kmaraz commented Nov 29, 2020

just-jeb commented Dec 8, 2020

kmaraz commented Dec 9, 2020

sonallux commented Nov 16, 2020 •

edited

Loading

just-jeb commented Nov 17, 2020 •

edited

Loading