Angular CLI: v12.0.0-next.9 Release

Release date:
April 14, 2021
Previous version:
v12.0.0-next.8 (released April 7, 2021)
Magnitude:
1,189 Diff Delta
Contributors:
5 total committers
Data confidence:
Commits:

37 Features Released with v12.0.0-next.9

Top Contributors in v12.0.0-next.9

clydin
alan-agius4
kyliau
dgp1130
renovate-bot

Directory Browser for v12.0.0-next.9

We haven't yet finished calculating and confirming the files and directories changed in this release. Please check back soon.

Release Notes Published

Commits

<table> <tbody>

<tr><td colspan=3><h3>@angular-devkit/build-angular (12.0.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/d883ce5d7e39de774fe90e4ccdbc9a84a600b7e8"><img align="top" title="Feature" src="https://img.shields.io/badge/d883ce5-feat-blue.svg" /> </a> </td>

<td>upgrade to Webpack 5 throughout the build system</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/d47b4417d46f85f9f5bb460576d32aa0104e6d43"><img align="top" title="Feature" src="https://img.shields.io/badge/d47b441-feat-blue.svg" /> </a> </td>

<td>support processing component inline CSS styles</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/bac563e5ee1efcda4bfb1334ecc0906796584cbd"><img align="top" title="Feature" src="https://img.shields.io/badge/bac563e-feat-blue.svg" /> </a> </td>

<td>support specifying stylesheet language for inline component styles</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/f1453126666af62a4ac4b4adca7d4282ecac0038"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/f145312-fix-green.svg" /> </a> </td>

<td>update karma builder to use non-deprecated API</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/bd0aba7c80cee63f6fbcb94247fdf3506e9b4afa"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/bd0aba7-fix-green.svg" /> </a> </td>

<td>disable webpack cache when using NG_BUILD_CACHE</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/cc52e5453cbf40810f56b6ea443c5f089c635a5d"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/cc52e54-fix-green.svg" /> </a> </td>

<td>remove duplicate application bundle generation complete message</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/27e63e2b33be48b26a44da69c09198ef9a8dce21"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/27e63e2-fix-green.svg" /> </a> </td>

<td>mark programmatic builder execution functions as experimental</td>

<td> </td> </tr>

<tr></tr>

<tr><td colspan=3><h3>@angular-devkit/build-webpack (0.1200.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/18c954129279d68b5c02c9f486a7db34be5492d1"><img align="top" title="Feature" src="https://img.shields.io/badge/18c9541-feat-blue.svg" /> </a> </td>

<td>support Webpack 5</td>

<td> </td> </tr>

<tr></tr>

<tr><td colspan=3><h3>@angular-devkit/core (12.0.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/08753138d336fb870a66face70f5624ba64b4c69"><img align="top" title="Feature" src="https://img.shields.io/badge/0875313-feat-blue.svg" /> </a> </td>

<td>update schema validator</td>

<td> </td> </tr>

<tr></tr>

<tr><td colspan=3><h3>@angular/cli (12.0.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/d68cb92dc2113753e7eefb91e54b70a60c1acd94"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/d68cb92-fix-green.svg" /> </a> </td>

<td>add message update updating from non LTS versions of the CLI</td>

<td> </td> </tr>

<tr></tr>

<tr><td colspan=3><h3>@ngtools/webpack (12.0.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/46e9d0e8a646805ba9e48aac1bc95761f2668571"><img align="top" title="Feature" src="https://img.shields.io/badge/46e9d0e-feat-blue.svg" /> </a> </td>

<td>support multiple plugin instances per compilation</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/5e5b2d9b1a15dc0f4f1690bab109bdd8e5613be3"><img align="top" title="Feature" src="https://img.shields.io/badge/5e5b2d9-feat-blue.svg" /> </a> </td>

<td>support generating data URIs for inline component styles in JIT</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/8c7d56e03adb9c3303760fc2e38e2d6d96452bac"><img align="top" title="Feature" src="https://img.shields.io/badge/8c7d56e-feat-blue.svg" /> </a> </td>

<td>support processing inline component styles in AOT</td>

<td> </td> </tr>

<tr></tr>

<tr><td colspan=3><h3>@schematics/angular (12.0.0-next.9)</h3></td></tr> <tr> <td><b>Commit</b> <td><b>Description</b> <td><b>Notes</b> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/695a01ba02b8c6e9656ed5ed5b0c5e17760ba21d"><img align="top" title="Feature" src="https://img.shields.io/badge/695a01b-feat-blue.svg" /> </a> </td>

<td>configure new libraries to be published in Ivy partial mode</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/84e023120864c014a2d1a275265c0941a0a16df2"><img align="top" title="Feature" src="https://img.shields.io/badge/84e0231-feat-blue.svg" /> </a> </td>

<td>update jasmine-spec-reporter to version 7</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/e33a3061f02828303e3c6ef508b5b23cbc73eef2"><img align="top" title="Feature" src="https://img.shields.io/badge/e33a306-feat-blue.svg" /> </a> </td>

<td>migrate web workers to support Webpack 5</td>

<td> </td> </tr>

<tr>

<td> <a href="https://github.com/angular/angular-cli/commit/df988c249363682aa6f9d3d95ae3b8636e24ebf9"><img align="top" title="Bug Fix" src="https://img.shields.io/badge/df988c2-fix-green.svg" /> </a> </td>

<td>update web-worker to support Webpack 5</td>

<td> </td> </tr>

</tbody> </table>


Breaking Changes

<h3> @angular-devkit/core: update schema validator (<a href="https://github.com/angular/angular-cli/commit/08753138d336fb870a66face70f5624ba64b4c69">0875313</a>) </h3> support for JSON Schema draft-04 and draft-06 is removed. If you have schemas using the id keyword replace them with $id. For an interim period we will auto rename any top level id keyword to $id.

NB: This change only effects schematics and builders authors.

<h3> @angular-devkit/build-angular: upgrade to Webpack 5 throughout the build system (<a href="https://github.com/angular/angular-cli/commit/d883ce5d7e39de774fe90e4ccdbc9a84a600b7e8">d883ce5</a>) </h3> Webpack 5 generates similar but differently named files for lazy loaded JavaScript files in development configurations (when the namedChunks option is enabled). For the majority of users this change should have no effect on the application and/or build process. Production builds should also not be affected as the namedChunks option is disabled by default in production configurations. However, if a project's post-build process makes assumptions as to the file names then adjustments may need to be made to account for the new naming paradigm. Such post-build processes could include custom file transformations after the build, integration into service-side frameworks, or deployment procedures. Example development file name change: lazy-lazy-module.js --> src_app_lazy_lazy_module_ts.js

<h3> @angular-devkit/build-angular: upgrade to Webpack 5 throughout the build system (<a href="https://github.com/angular/angular-cli/commit/d883ce5d7e39de774fe90e4ccdbc9a84a600b7e8">d883ce5</a>) </h3> Webpack 5 now includes web worker support. However, the structure of the URL within the Worker constructor must be in a specific format that differs from the current requirement. Web worker usage should be updated as shown below (where ./app.worker should be replaced with the actual worker name):

Before: new Worker('./app.worker', ...)

After:
new Worker(new URL('./app.worker', import.meta.url), ...)


Special Thanks

Alan Agius, Charles Lyding, Keen Yee Liau, Doug Parker, Douglas Parker