With this change we configure HMR internally and therefore users which want to use basic HMR functionality will not longer be required to change their application code.
This is important because previously a lot of users missed out on HMR or reported a broken behaviour. This also gives novice users a better chance to appreciate HMR and Angular because of the zero effort required to use HMR.
Closes#17324
The test was previously run only in Ivy mode but with VE specific test case files. The test now also enables strict templates to ensure template type checking files are properly excluded.
BREAKING CHANGE:
Deprecated `TestLogger` has been removed. Use `logging` API from `'@angular-devkit/core'` instead.
**Note:** this change doesn't effect application developers.
The license extraction plugin is currently causing errors when building/serving with Webpack 5. This change temporarily disables the option when Webpack 5 is used until further investigation can take place and to unblock initial Webpack 5 support.
This change adds helpers to allow the Webpack configuration to be automatically adjusted based on the Webpack version in use.
These helpers are then used to provide configuration compatibility for Webpack 5 which has several differences to the Webpack 4 configuration.
Behavior is maintained between the two versions so that external option behavior is not altered.
The structure of the data from the `afterResolve` hook has changed in Webpack 5. This change provides compatibility for both the Webpack 5+ and Webpack 4 variants.
With this change we improve the debugging experience with 2 things.
1. Cleaner Karma stack traces in the terminal
Before
```
Chrome 84.0.4147.105 (Mac OS 10.15.5) AppComponent should have as title 'foo' FAILED
Error: Expected 'foo' to equal 'fox'.
at <Jasmine>
at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/webpack:/projects/foo/src/app/app.component.spec.ts:22:23)
at ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-evergreen.js:364:1)
at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-testing.js:292:1)
Chrome 84.0.4147.105 (Mac OS 10.15.5): Executed 3 of 3 (1 FAILED) (0 secs / 0.214 secs)
Chrome 84.0.4147.105 (Mac OS 10.15.5) AppComponent should have as title 'foo' FAILED
Error: Expected 'foo' to equal 'fox'.
at <Jasmine>
at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/webpack:/projects/foo/src/app/app.component.spec.ts:22:23)
at ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-evergreen.js:364:1)
at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zChrome 84.0.4147.105 (Mac OS 10.15.5): Executed 3 of 3 (1 FAILED) (0.225 secs / 0.214 secs)
```
After
```
Chrome 84.0.4147.105 (Mac OS 10.15.5) AppComponent should have as title 'foo' FAILED
Error: Expected 'foo' to equal 'fox'.
at <Jasmine>
at UserContext.<anonymous> (projects/foo/src/app/app.component.spec.ts:22:23)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:364:1)
at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/zone-testing.js:292:1)
Chrome 84.0.4147.105 (Mac OS 10.15.5): Executed 2 of 3 (1 FAILED) (0 secs / 0.225 secs)
Chrome 84.0.4147.105 (Mac OS 10.15.5) AppComponent should have as title 'foo' FAILED
Error: Expected 'foo' to equal 'fox'.
at <Jasmine>
at UserContext.<anonymous> (projects/foo/src/app/app.component.spec.ts:22:23)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:364:1)
Chrome 84.0.4147.105 (Mac OS 10.15.5): Executed 3 of 3 (1 FAILED) (0.281 secs / 0.237 secs)
```
2. Reduce VS Code configuration
Before
```
{
"name": "ng test",
"type": "chrome",
"request": "launch",
"url": "http://localhost:9876/debug.html",
"webRoot": "${workspaceFolder}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/*",
"/./*": "${webRoot}/*",
"/src/*": "${webRoot}/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*"
}
},
```
After
```
{
"name": "ng test",
"type": "chrome",
"request": "launch",
"url": "http://localhost:9876/debug.html",
"webRoot": "${workspaceFolder}",
},
```
The type of the first parameter of the internal unwrapTemplateLiteral function should be a `NodePath<types.TaggedTemplateExpression>` not a `NodePath<types.TemplateLiteral>`.
Webpack 5+ no longer provides node shims by default. The dev-server builder previously assumed that Webpack would provide them. This change adds a conditional check to cover both cases.
BREAKING CHANGE:
- Deprecated `scripts[].lazy` has been renamed with `scripts[].inject`
- Deprecated `styles[].lazy` has been renamed with `styles[].inject`
Note: this change only effects direct `@angular-devkit/build-angular` users and not application developers. Users will be migrated automatically off these options.
BREAKING CHANGE:
Browser builder `extractCss` option default value has been changed from `false` to `true`. This is to reflect the default behaviour when this deprecated option is removed.
The dev-server builder will now ask the user if an available port can be used when a specified port is already in use. If the user answers in the affirmative, an available port will be used instead. Otherwise, the serve operation will fail. If the terminal is not interactive (for example, CI), the serve operation will fail directly in the event of an already in use port.
Several utility functions within `@angular/localize` were updated in 10.1.0. This change ensures that this newer version will function with 10.1.0 of `@angular-devkit/build-angular`.
This change allows the underlying webpack configuration of the i18n extraction builder to be modified when programmatically using the builder.
Programmatic usage of the `@angular-devkit/build-angular` builders is currently considered experimental.
Closes#16679
This change adds support for extracting i18n translation messages with an Ivy enabled application. This is accomplished by using the new extraction capabilities present in the `@angular/localize` package and will require version 10.1 or later of the package. Since this change uses an new extraction method, it currently must be enabled during extraction by using the `--ivy` flag. The flag is a precaution to prevent unintentional breakage for existing applications but will become the default behavior for all Ivy enabled applications in a future release.
Closes#18275
