Standalone ng generate schematic prerequisites and step one #48790

crisbeto · 2023-01-20T09:01:44Z

These changes add some of the prerequisites for the first step of the standalone ng generate schematic, as well as the first step itself. There's more info in the individual commits, but here's a high-level overview.

Allows aliases to be specified in the ImportManager.
Some minor improvements to our schematic utilities.
Boilerplate for ng generate schematics in core.
First mode of the ng generate @angular/core:standalone schematic. There will be two more that are going to be added in follow-up PRs.

crisbeto · 2023-01-20T09:02:56Z

packages/core/schematics/ng-generate/standalone-migration/README.md

@@ -0,0 +1,2 @@
+# Standalone migration
+TODO


This will be added in one of the later PRs.

crisbeto · 2023-01-20T09:03:31Z

packages/core/schematics/ng-generate/standalone-migration/util.ts

+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+


There are a few utilties in this file that aren't being used yet. They'll come into play in the next PRs.

packages/core/schematics/utils/import_manager.ts

… manager Adds the ability to set an alias when adding an import through the `ImportManager`. This will be required in some upcoming schematics.

Makes the following minor improvements to our current schematic utilities: * `closestNode` now takes a TS predicate function instead of a `SyntaxKind`. This allows it automatically infer the type of the match. * `getImportSpecifier` now accepts a regex for the module name. This will be useful for some upcoming migrations. * Splits the logic for creating the migration program options into a separate function so that it's easier to reuse. * `createMigrationProgram` now returns the program directly, instead of a literal with some other information. * `FakeReadFileFn` and `createMigrationCompilerHost` aren't exported anymore since they aren't used anywhere.

Adds the necessary boilerplate to allow for `ng generate` schematics to be included with `@angular/core`.

devversion

Nice work! just a few questions/minor comments

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

devversion · 2023-01-20T14:27:03Z

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

+  } else if (ts.isObjectLiteralExpression(node.expression.arguments[0])) {
+    literalProperties = [...node.expression.arguments[0].properties, property];
+  } else {
+    // Unsupported case (e.g. `@Component(SOME_CONST)`). Return the original node.


Should there be a TODO inserted or is it intended to just silently do nothing?

My thinking was that these cases are pretty rare so it's not worth it to insert a TODO.

Yeah, definitely rare. Just seems trivial to add a comment, and to avoid future issues where people would report some classes not being migrated. Your call

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

packages/core/schematics/ng-generate/standalone-migration/util.ts

packages/core/schematics/test/standalone_migration_spec.ts

devversion · 2023-01-20T15:03:52Z

packages/core/schematics/test/standalone_migration_spec.ts

+      @Component({
+        template: '<hello></hello>',
+        standalone: true,
+        imports: [ButtonModule, MatCardModule]


One question: Should Hello be also an import here?

Technically it should, but I intentionally didn't include copying of test module declarations, because I thought that it has a high chance of being incorrect and breaking a test in a vague way. This way at least the error message should be pretty obvious. Since we don't have access to the type checker in test files, the migration is more of a "best attempt" rather than trying to be entirely correct.

Sounds reasonable, good that we have chatted about this though.

…dalone Implements a new `ng generate @angular/core:standalone` schematic that allows the user to convert all the declarations in a set of NgModules to standalone.

crisbeto

Feedback has been addressed.

crisbeto · 2023-01-20T16:06:40Z

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

+  } else if (ts.isObjectLiteralExpression(node.expression.arguments[0])) {
+    literalProperties = [...node.expression.arguments[0].properties, property];
+  } else {
+    // Unsupported case (e.g. `@Component(SOME_CONST)`). Return the original node.


My thinking was that these cases are pretty rare so it's not worth it to insert a TODO.

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

packages/core/schematics/test/standalone_migration_spec.ts

crisbeto · 2023-01-20T16:19:01Z

packages/core/schematics/test/standalone_migration_spec.ts

+      @Component({
+        template: '<hello></hello>',
+        standalone: true,
+        imports: [ButtonModule, MatCardModule]


Technically it should, but I intentionally didn't include copying of test module declarations, because I thought that it has a high chance of being incorrect and breaking a test in a vague way. This way at least the error message should be pretty obvious. Since we don't have access to the type checker in test files, the migration is more of a "best attempt" rather than trying to be entirely correct.

jessicajaniuk · 2023-01-24T16:48:21Z

This PR was merged into the repository by commit a154db8.

…es (#48790) Makes the following minor improvements to our current schematic utilities: * `closestNode` now takes a TS predicate function instead of a `SyntaxKind`. This allows it automatically infer the type of the match. * `getImportSpecifier` now accepts a regex for the module name. This will be useful for some upcoming migrations. * Splits the logic for creating the migration program options into a separate function so that it's easier to reuse. * `createMigrationProgram` now returns the program directly, instead of a literal with some other information. * `FakeReadFileFn` and `createMigrationCompilerHost` aren't exported anymore since they aren't used anywhere. PR Close #48790

Adds the necessary boilerplate to allow for `ng generate` schematics to be included with `@angular/core`. PR Close #48790

…dalone (#48790) Implements a new `ng generate @angular/core:standalone` schematic that allows the user to convert all the declarations in a set of NgModules to standalone. PR Close #48790

… manager (angular#48790) Adds the ability to set an alias when adding an import through the `ImportManager`. This will be required in some upcoming schematics. PR Close angular#48790

…es (angular#48790) Makes the following minor improvements to our current schematic utilities: * `closestNode` now takes a TS predicate function instead of a `SyntaxKind`. This allows it automatically infer the type of the match. * `getImportSpecifier` now accepts a regex for the module name. This will be useful for some upcoming migrations. * Splits the logic for creating the migration program options into a separate function so that it's easier to reuse. * `createMigrationProgram` now returns the program directly, instead of a literal with some other information. * `FakeReadFileFn` and `createMigrationCompilerHost` aren't exported anymore since they aren't used anywhere. PR Close angular#48790

Adds the necessary boilerplate to allow for `ng generate` schematics to be included with `@angular/core`. PR Close angular#48790

…dalone (angular#48790) Implements a new `ng generate @angular/core:standalone` schematic that allows the user to convert all the declarations in a set of NgModules to standalone. PR Close angular#48790

This PR contains the following updates: | Package | Type | Update | Change | |---|---|---|---| | [@angular/animations](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fanimations/15.1.5/15.2.0) | | [@angular/common](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fcommon/15.1.5/15.2.0) | | [@angular/compiler](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fcompiler/15.1.5/15.2.0) | | [@angular/compiler-cli](https://github.com/angular/angular/tree/main/packages/compiler-cli) ([source](https://github.com/angular/angular)) | devDependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fcompiler-cli/15.1.5/15.2.0) | | [@angular/core](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fcore/15.1.5/15.2.0) | | [@angular/forms](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fforms/15.1.5/15.2.0) | | [@angular/platform-browser](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fplatform-browser/15.1.5/15.2.0) | | [@angular/platform-browser-dynamic](https://github.com/angular/angular) | dependencies | minor | [`15.1.5` -> `15.2.0`](https://renovatebot.com/diffs/npm/@angular%2fplatform-browser-dynamic/15.1.5/15.2.0) | --- ### Release Notes <details> <summary>angular/angular</summary> ### [`v15.2.0`](https://github.com/angular/angular/blob/HEAD/CHANGELOG.md#1520-2023-02-22) [Compare Source](angular/angular@15.1.5...15.2.0) #### Deprecations ##### - Class and `InjectionToken` guards and resolvers are deprecated. Instead, write guards as plain JavaScript functions and inject dependencies with `inject` from `@angular/core`. ##### | Commit | Type | Description | | -- | -- | -- | | [926c35f4ac](angular/angular@926c35f) | docs | Deprecate class and InjectionToken and resolvers ([#47924](angular/angular#47924)) | ##### common | Commit | Type | Description | | -- | -- | -- | | [54b24eb40f](angular/angular@54b24eb) | feat | Add loaderParams attribute to NgOptimizedImage ([#48907](angular/angular#48907)) | ##### compiler-cli | Commit | Type | Description | | -- | -- | -- | | [0cf11167f1](angular/angular@0cf1116) | fix | incorrectly detecting forward refs when symbol already exists in file ([#48988](angular/angular#48988)) | ##### core | Commit | Type | Description | | -- | -- | -- | | [a154db8a81](angular/angular@a154db8) | feat | add ng generate schematic to convert declarations to standalone ([#48790](angular/angular#48790)) | | [345e737daa](angular/angular@345e737) | feat | add ng generate schematic to convert to standalone bootstrapping APIs ([#48848](angular/angular#48848)) | | [e7318fc758](angular/angular@e7318fc) | feat | add ng generate schematic to remove unnecessary modules ([#48832](angular/angular#48832)) | ##### language-service | Commit | Type | Description | | -- | -- | -- | | [4ae384fd61](angular/angular@4ae384f) | feat | Allow auto-imports of a pipe via quick fix when its selector is used, both directly and via reexports. ([#48354](angular/angular#48354)) | | [141333411e](angular/angular@1413334) | feat | Introduce a new NgModuleIndex, and use it to suggest re-exports. ([#48354](angular/angular#48354)) | | [d0145033bd](angular/angular@d014503) | fix | generate forwardRef for same file imports ([#48898](angular/angular#48898)) | ##### migrations | Commit | Type | Description | | -- | -- | -- | | [2796230e95](angular/angular@2796230) | fix | add `enum` in `mode` option in `standalone` schema ([#48851](angular/angular#48851)) | | [816e76a578](angular/angular@816e76a) | fix | automatically prune root module after bootstrap step ([#49030](angular/angular#49030)) | | [bdbf21d04b](angular/angular@bdbf21d) | fix | avoid generating imports with forward slashes ([#48993](angular/angular#48993)) | | [32cf4e5cb9](angular/angular@32cf4e5) | fix | avoid internal modules when generating imports ([#48958](angular/angular#48958)) | | [521ccfbe6c](angular/angular@521ccfb) | fix | avoid interrupting the migration if language service lookup fails ([#49010](angular/angular#49010)) | | [a40cd47aa7](angular/angular@a40cd47) | fix | avoid modifying testing modules without declarations ([#48921](angular/angular#48921)) | | [1afa6ed322](angular/angular@1afa6ed) | fix | don't add ModuleWithProviders to standalone test components ([#48987](angular/angular#48987)) | | [c98c6a8452](angular/angular@c98c6a8) | fix | don't copy animations modules into the imports of test components ([#49147](angular/angular#49147)) | | [8389557848](angular/angular@8389557) | fix | don't copy unmigrated declarations into imports array ([#48882](angular/angular#48882)) | | [f82bdc4b01](angular/angular@f82bdc4) | fix | don't delete classes that may provide dependencies transitively ([#48866](angular/angular#48866)) | | [759db12e0b](angular/angular@759db12) | fix | duplicated comments on migrated classes ([#48966](angular/angular#48966)) | | [ba38178d19](angular/angular@ba38178) | fix | generate forwardRef for same file imports ([#48898](angular/angular#48898)) | | [03fcb36cfd](angular/angular@03fcb36) | fix | migrate HttpClientModule to provideHttpClient() ([#48949](angular/angular#48949)) | | [2de6dae16d](angular/angular@2de6dae) | fix | migrate RouterModule.forRoot with a config object to use features ([#48935](angular/angular#48935)) | | [770191cf1f](angular/angular@770191c) | fix | migrate tests when switching to standalone bootstrap API ([#48987](angular/angular#48987)) | | [c7926b5773](angular/angular@c7926b5) | fix | move standalone migrations into imports ([#48987](angular/angular#48987)) | | [65c74ed93e](angular/angular@65c74ed) | fix | normalize paths to posix ([#48850](angular/angular#48850)) | | [6377487b1a](angular/angular@6377487) | fix | only exclude bootstrapped declarations from initial standalone migration ([#48987](angular/angular#48987)) | | [e9e4449a43](angular/angular@e9e4449) | fix | preserve tsconfig in standalone migration ([#48987](angular/angular#48987)) | | [ffad1b49d9](angular/angular@ffad1b4) | fix | reduce number of files that need to be checked ([#48987](angular/angular#48987)) | | [ba7a757cc5](angular/angular@ba7a757) | fix | return correct alias when conflicting import exists ([#49139](angular/angular#49139)) | | [49a7c9f94a](angular/angular@49a7c9f) | fix | standalone migration incorrectly throwing path error for multi app projects ([#48958](angular/angular#48958)) | | [584976e6c8](angular/angular@584976e) | fix | support --defaults in standalone migration ([#48921](angular/angular#48921)) | | [03f47ac901](angular/angular@03f47ac) | fix | use consistent quotes in generated imports ([#48876](angular/angular#48876)) | | [ebae506d89](angular/angular@ebae506) | fix | use import remapper in root component ([#49046](angular/angular#49046)) | | [40c976c909](angular/angular@40c976c) | fix | use NgForOf instead of NgFor ([#49022](angular/angular#49022)) | | [4ac25b2aff](angular/angular@4ac25b2) | perf | avoid re-traversing nodes when resolving bootstrap call dependencies ([#49010](angular/angular#49010)) | | [26cb7ab2e6](angular/angular@26cb7ab) | perf | speed up language service lookups ([#49010](angular/angular#49010)) | ##### platform-browser | Commit | Type | Description | | -- | -- | -- | | [bf4ad38117](angular/angular@bf4ad38) | fix | remove styles from DOM of destroyed components ([#48298](angular/angular#48298)) | ##### platform-server | Commit | Type | Description | | -- | -- | -- | | [25e220a23a](angular/angular@25e220a) | fix | avoid duplicate TransferState info after renderApplication call ([#49094](angular/angular#49094)) | ##### router | Commit | Type | Description | | -- | -- | -- | | [31b94c762f](angular/angular@31b94c7) | feat | Add a withNavigationErrorHandler feature to provideRouter ([#48551](angular/angular#48551)) | | [dedac8d3f7](angular/angular@dedac8d) | feat | Add test helper for trigger navigations in tests ([#48552](angular/angular#48552)) | #### Special Thanks Alan Agius, Alex Castle, Alex Rickabaugh, Andrew Kushnir, Andrew Scott, Dylan Hunn, Ikko Eltociear Ashimine, Ilyass, Jessica Janiuk, Joey Perrott, John Manners, Kalbarczyk, Kristiyan Kostadinov, Matthieu Riegler, Paul Gschwendtner, Pawel Kozlowski, Virginia Dooley, Walid Bouguima, cexbrayat and mgechev  </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about these updates again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate).  Co-authored-by: cabr2-bot <cabr2.help@gmail.com> Reviewed-on: https://codeberg.org/Calciumdibromid/CaBr2/pulls/1793 Reviewed-by: Epsilon_02 <epsilon_02@noreply.codeberg.org> Co-authored-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org> Co-committed-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>

angular-automatic-lock-bot · 2023-02-24T16:06:46Z

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.}

crisbeto added action: review The PR is still awaiting reviews from at least one requested reviewer area: core Issues related to the framework runtime area: migrations Issues related to `ng update` migrations target: minor This PR is targeted for the next minor release labels Jan 20, 2023

ngbot bot added this to the Backlog milestone Jan 20, 2023

angular-robot bot added detected: feature PR contains a feature commit area: build & ci Related the build and CI infrastructure of the project labels Jan 20, 2023

crisbeto commented Jan 20, 2023

View reviewed changes

crisbeto requested review from devversion and AndrewKushnir January 20, 2023 09:16

crisbeto marked this pull request as ready for review January 20, 2023 09:17

devversion reviewed Jan 20, 2023

View reviewed changes

packages/core/schematics/utils/import_manager.ts Show resolved Hide resolved

packages/core/schematics/utils/import_manager.ts Show resolved Hide resolved

crisbeto added 3 commits January 20, 2023 15:00

refactor(migrations): allow for aliases to be specified in the import…

a960557

… manager Adds the ability to set an alias when adding an import through the `ImportManager`. This will be required in some upcoming schematics.

build: set up ng generate schematics for core

759b947

Adds the necessary boilerplate to allow for `ng generate` schematics to be included with `@angular/core`.

crisbeto force-pushed the standalone-schematic-setup branch from 3983dd7 to b206470 Compare January 20, 2023 14:01

devversion approved these changes Jan 20, 2023

View reviewed changes

feat(core): add ng generate schematic to convert declarations to stan…

e9d9b2f

…dalone Implements a new `ng generate @angular/core:standalone` schematic that allows the user to convert all the declarations in a set of NgModules to standalone.

crisbeto force-pushed the standalone-schematic-setup branch from b206470 to e9d9b2f Compare January 20, 2023 16:19

crisbeto commented Jan 20, 2023

View reviewed changes

devversion approved these changes Jan 20, 2023

View reviewed changes

AndrewKushnir approved these changes Jan 23, 2023

View reviewed changes

crisbeto added action: merge The PR is ready for merge by the caretaker and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Jan 23, 2023

jessicajaniuk closed this in e4b2845 Jan 24, 2023

jessicajaniuk pushed a commit that referenced this pull request Jan 24, 2023

build: set up ng generate schematics for core (#48790)

b37a624

Adds the necessary boilerplate to allow for `ng generate` schematics to be included with `@angular/core`. PR Close #48790

angular-automatic-lock-bot bot locked and limited conversation to collaborators Feb 24, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Standalone ng generate schematic prerequisites and step one #48790

Standalone ng generate schematic prerequisites and step one #48790

crisbeto commented Jan 20, 2023 •

edited

crisbeto Jan 20, 2023 •

edited

crisbeto Jan 20, 2023

devversion left a comment

devversion Jan 20, 2023

crisbeto Jan 20, 2023

devversion Jan 20, 2023

devversion Jan 20, 2023

crisbeto Jan 20, 2023

devversion Jan 20, 2023

crisbeto left a comment

crisbeto Jan 20, 2023

crisbeto Jan 20, 2023

jessicajaniuk commented Jan 24, 2023

angular-automatic-lock-bot bot commented Feb 24, 2023

Standalone ng generate schematic prerequisites and step one #48790

Standalone ng generate schematic prerequisites and step one #48790

Conversation

crisbeto commented Jan 20, 2023 • edited

crisbeto Jan 20, 2023 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

devversion 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

crisbeto left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

jessicajaniuk commented Jan 24, 2023

angular-automatic-lock-bot bot commented Feb 24, 2023

crisbeto commented Jan 20, 2023 •

edited

crisbeto Jan 20, 2023 •

edited