The `adjust-typescript-enums` plugin now includes an optional loose mode. This mode generates less code for an adjusted enum but differs from the canonical TypeScript enum structure emitted by the TypeScript compiler. This mode is only enabled for packages validated to operate correctly with this structure and is currently limited to first-party Angular packages. The adjusted structure is a variation of the previous build optimizer pass structure but better reflects the runtime behavior of the TypeScript emit structure.
The new babel-based build optimizer passes are now enabled when targetting ES2015 and higher. ES5 targets will currently continue to use the previous build optimizer. ES5 support will require additional refactoring of the downlevelling process as the new build optimizer passes are designed for ES2015 code.
The build optimizer passes that are still relevant for Ivy are now implemented as babel plugins. Using babel has several advantages. The `babel-loader` is already present within the build pipeline and many packages will already need to be processed by it. The `babel-loader` also provides the necessary infrastructure to setup babel and link it to the Webpack build system. This removes the need for the infrastructure code within the build optimizer loader and reduces the build optimizer to only a set of transformation plugins for babel to consume. The babel plugin architecture also allows for less code to represent similar transformations and provides a variety of helper utilities which further reduces the amount code needed.
The passes are now implemented to be safer when transforming code. Enum values which contain potential side effects are also no longer altered. Enums are wrapped in less destructive manner which reduces the likelihood of incorrectly emitting the transformed enum. Class static fields which contain potential side effects are no longer wrapped in pure annotated IIFEs. Known safe Angular static fields are also wrapped and Angular static fields which are not required in production code are also dropped.
The conversion of the passes not only reduces the amount of code to maintain but also provides a noticeable performance improvement. Initial tests of a production build of AIO resulted in a ~10% total build time reduction.
Closes#12160
With the recent changes in https://github.com/angular/angular-cli/pull/20960 we moved the spinner to be started outside of the progress callback, this causes a side-effect that after `succeed` is called the spinner will stop reporting progress unless it is started again.
Sass Worker instances and resource requests are now cleaned up when the Webpack compiler is shutdown. This removes the need to unreference the workers upon creation.
Fixes#20985
Webpack will only provide emitted assets in the returned Stats each rebuild unless the `cachedAssets` option is enabled. This is currently needed for the bundle budget calculations.
Fixes#21038
Until we depend on `webpackStats` in the browser builder we should only included the required stats.
The below are the needed stats;
```
all: false,
colors: true,
hash: true,
timings: true,
chunks: true,
builtAt: true,
warnings: true,
errors: true,
assets: true,
ids: true,
entrypoints: true,
```
Since sass 1.33.0, an importer can determine whether it’s being called from an `@import` rule by checking `this.fromImport`. This API, is now being used by `sass-loader` version 12.
With this change we update to `webpack` to `5.38.1`, this also updates `webpack-sources` to `2.3.0`, The latter is causing OOM errors on our CI, but it in real projects the memory usage only increased by a small fraction. Also, the OOM errors don't manifest themselves when the entire test suit is run locally.
Therefore with this change we also disable sourcemap genertation for most of the browser builds to speed up the tests and reduce memery usage.
With this change we provide earlier feedback in the console during a build. The setup phase can take some times if the project has a large set of dependencies.
We also move several warnings in the dev-server to an earlier phase so that we don't clutter the progress indicator.
Closes#20957
The new `ngtools/webpack` option leverages the inline resource matching syntax combined with a custom loader instead of data URIs. This provides better resource path in loaders that do not yet fully support scheme-based resource requests.
Loading the postcss-preset-env plugin includes building a mapping of unsupported
browsers by feature, which is somewhat expensive. In large compilations, this mapping
would be recomputed for each postcss-loader instance, as the plugin was recreated
for each loader invocation. By extracting the plugin instance outside of the dynamic
plugin computation, this overhead is avoided.
Since #20518, the generation of the ServiceWorker configuration has been
broken on Windows. The reason is the use of `path.posix.*` methods on
non-POSIX paths, resulting in broken paths. I.e. we ended up with
something like the following:
```js
path.posix.relative('C:\\foo', 'C:\\foo\\bar/baz');
// Expected result: `bar/baz`
// Actual result: `../C:\\foo\\bar/baz`
```
This caused the config generator to fail to find any files and thus fail
to populate the config with cacheable assets.
This commit fixes this by using platform-specific `path.*` methods for
path manipulation and manually normalizing the path separators before
returning the results.
Fixes#20894
With this change we re-emit assets referenced in component stylesheets which where uneffected by the change that re-triggered a re-compilation.
Since we cache the the result of processed component CSS, during a re-compilation `postcss-cli-resources` plugin will not run which causes assets to be to emit. With this change we now cache the asset and re-emit them on every change.
Closes#20882
Since we rely on child compilations to compile components CSS, using the `parallel` option will cause a significant overhead because each compilation will need to spawn a worker, in this mode the worker limit is not be honored because `css-minimizer-webpack-plugin` spawn and calulators workers during the optimization phase of a compilation and not globally per instance hence causes OOM because a large number of workers to be spawned simultaneously.
Closes#20883
As reported in #20113, webpack triggers a Trusted Types violation when
lazy-loading is used. To mitigate that, enable webpack's Trusted Types
module (introduced in webpack/webpack#9856) using 'angular#bundler' as
the policy name.
The Worker constructor option for a transfer list is unfortunately not supported until Node.js 12.17. For Node.js versions prior to 12.17, a manual message post is now used to transfer the necessary initialization data to the Sass workers.
This reduce memory consumption during re-builds.
```
runtime.ba93f81591909b93394f.hot-update.js.map will be removed
styles.ba93f81591909b93394f.hot-update.js.map will be removed
runtime.ba93f81591909b93394f.hot-update.json will be removed
runtime.ba93f81591909b93394f.hot-update.js will be removed
styles.ba93f81591909b93394f.hot-update.js will be removed
```
See https://github.com/webpack/webpack/issues/12947#issuecomment-812108140 and https://github.com/webpack/webpack/issues/13127
