fix(router): add error message when using loadComponent with an NgModule #49164

Ivnosing · 2023-02-22T17:38:33Z

Add a more specific error message when defining a lazy-loaded route using loadComponent and passing it an NgModule instead of a standalone component, when the user should actually be using loadChildren.

PR Checklist

Please check if your PR fulfills the following requirements:

The commit message follows our guidelines: https://github.com/angular/angular/blob/main/CONTRIBUTING.md#commit
Tests for the changes have been added (for bug fixes / features)
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
angular.io application / infrastructure changes
Other... Please describe:

What is the current behavior?

Issue Number: #48945

What is the new behavior?

Users are prompted with the error:
Invalid configuration of route 'XYZ'. You are using 'loadComponent' with a module, but it must be used with standalone components. Use 'loadChildren' instead.

Does this PR introduce a breaking change?

Yes
No

Other information

I wasn't sure how to check if the value was a NgModule. If there's a better way please let me know.

Add a more specific error message when defining a lazy-loaded route using `loadComponent` and passing it a NgModule instead of a standalone component, when the user should actually be using `loadChildren`.

atscott · 2023-02-22T21:42:24Z

packages/router/src/utils/config.ts

@@ -57,7 +57,13 @@ export function validateConfig(
 }

 export function assertStandalone(fullPath: string, component: Type<unknown>|undefined) {
-  if (component && !isStandalone(component)) {
+  if (component && (component as any)[NG_MOD_DEF]) {


Hmm, I think it would probably be worth exporting isNgModule from the private exports at this point. https://github.com/angular/angular/blob/main/packages/core/src/render3/jit/util.ts#L18

I saw it but indeed it is private. Should I add it to the exports of core in this PR?

NG_MOD_DEF is exported from https://github.com/angular/angular/blob/main/packages/core/src/core_render3_private_export.ts. You can add isNgModule as another private export there.

… NgModule

ngbot · 2023-02-27T16:54:41Z

I see that you just added the action: merge label, but the following checks are still failing:
status "ci/circleci: test_win" is failing

If you want your PR to be merged, it has to pass all the CI checks.

If you can't get the PR to a green state due to flakes or broken main, please try rebasing to main and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help.

AndrewKushnir · 2023-02-27T18:09:58Z

This PR was merged into the repository by commit 7e35a91.

…le (#49164) Add a more specific error message when defining a lazy-loaded route using `loadComponent` and passing it a NgModule instead of a standalone component, when the user should actually be using `loadChildren`. PR Close #49164

This PR contains the following updates: | Package | Type | Update | Change | |---|---|---|---| | [@angular/animations](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fanimations/15.2.0/15.2.4) | | [@angular/common](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fcommon/15.2.0/15.2.4) | | [@angular/compiler](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fcompiler/15.2.0/15.2.4) | | [@angular/compiler-cli](https://github.com/angular/angular/tree/main/packages/compiler-cli) ([source](https://github.com/angular/angular)) | devDependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fcompiler-cli/15.2.0/15.2.4) | | [@angular/core](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fcore/15.2.0/15.2.4) | | [@angular/forms](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fforms/15.2.0/15.2.4) | | [@angular/platform-browser](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fplatform-browser/15.2.0/15.2.4) | | [@angular/platform-browser-dynamic](https://github.com/angular/angular) | dependencies | patch | [`15.2.0` -> `15.2.4`](https://renovatebot.com/diffs/npm/@angular%2fplatform-browser-dynamic/15.2.0/15.2.4) | | [zone.js](https://github.com/angular/angular) ([changelog](https://github.com/angular/angular/blob/master/packages/zone.js/CHANGELOG.md)) | dependencies | minor | [`0.12.0` -> `0.13.0`](https://renovatebot.com/diffs/npm/zone.js/0.12.0/0.13.0) | --- ### Release Notes <details> <summary>angular/angular (@angular/animations)</summary> ### [`v15.2.4`](https://github.com/angular/angular/blob/HEAD/CHANGELOG.md#1524-2023-03-22) [Compare Source](angular/angular@15.2.3...15.2.4) ##### core | Commit | Type | Description | | -- | -- | -- | | [bae6b5ceb1](angular/angular@bae6b5c) | fix | Allow `TestBed.configureTestingModule` to work with recursive cycle of standalone components. ([#49473](angular/angular#49473)) | | [087f4412af](angular/angular@087f441) | fix | more accurate matching of classes during content projection ([#48888](angular/angular#48888)) | #### Special Thanks Aditya Srinivasan, Alex Rickabaugh, Andrew Scott, Kristiyan Kostadinov, Masaoki Kobayashi, Matthieu Riegler, Paul Gschwendtner, Peter Götz, Thomas Pischke, Virginia Dooley and avmaxim  ### [`v15.2.3`](https://github.com/angular/angular/blob/HEAD/CHANGELOG.md#1523-2023-03-16) [Compare Source](angular/angular@15.2.2...15.2.3) #### Special Thanks Alan Agius, Esteban Gehring, Matthieu Riegler and Virginia Dooley  ### [`v15.2.2`](https://github.com/angular/angular/blob/HEAD/CHANGELOG.md#1522-2023-03-08) [Compare Source](angular/angular@15.2.1...15.2.2) ##### migrations | Commit | Type | Description | | -- | -- | -- | | [6207d6f1f0](angular/angular@6207d6f) | fix | add protractor support if protractor imports are detected ([#49274](angular/angular#49274)) | #### Special Thanks Alan Agius, Andrew Kushnir, Andrew Scott, Kristiyan Kostadinov, Matthieu Riegler, Paul Gschwendtner, Sai Kartheek Bommisetty and Vinit Neogi  ### [`v15.2.1`](https://github.com/angular/angular/blob/HEAD/CHANGELOG.md#1521-2023-03-01) [Compare Source](angular/angular@15.2.0...15.2.1) ##### common | Commit | Type | Description | | -- | -- | -- | | [f0e926074d](angular/angular@f0e9260) | fix | make Location.normalize() return the correct path when the base path contains characters that interfere with regex syntax. ([#49181](angular/angular#49181)) | ##### compiler-cli | Commit | Type | Description | | -- | -- | -- | | [04d8b6c61a](angular/angular@04d8b6c) | fix | do not persist component analysis if template/styles are missing ([#49184](angular/angular#49184)) | ##### core | Commit | Type | Description | | -- | -- | -- | | [d60ea6ab5a](angular/angular@d60ea6a) | fix | update zone.js peerDependencies ranges ([#49244](angular/angular#49244)) | ##### migrations | Commit | Type | Description | | -- | -- | -- | | [44d095a61c](angular/angular@44d095a) | fix | avoid migrating the same class multiple times in standalone migration ([#49245](angular/angular#49245)) | | [92b0bda9e4](angular/angular@92b0bda) | fix | delete barrel exports in standalone migration ([#49176](angular/angular#49176)) | ##### router | Commit | Type | Description | | -- | -- | -- | | [3062442728](angular/angular@3062442) | fix | add error message when using loadComponent with a NgModule ([#49164](angular/angular#49164)) | #### Special Thanks Alan Agius, Andrew Kushnir, Aristeidis Bampakos, Craig Spence, Doug Parker, Iván Navarro, Joey Perrott, Kristiyan Kostadinov, Matthieu Riegler, Michael Ziluck, Paul Gschwendtner, Stephanie Tuerk, Vincent and Virginia Dooley  </details> <details> <summary>angular/angular (zone.js)</summary> ### [`v0.13.0`](angular/angular@zone.js-0.12.0...zone.js-0.13.0) [Compare Source](angular/angular@zone.js-0.12.0...zone.js-0.13.0) </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. 👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://github.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] 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/1801 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-03-30T16:06:50Z

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

fix(router): add error message when using loadComponent with a NgModule

8096ca0

Add a more specific error message when defining a lazy-loaded route using `loadComponent` and passing it a NgModule instead of a standalone component, when the user should actually be using `loadChildren`.

pullapprove bot requested a review from atscott February 22, 2023 17:38

atscott reviewed Feb 22, 2023

View reviewed changes

fixup! fix(router): add error message when using loadComponent with a…

ccb66d8

… NgModule

atscott approved these changes Feb 27, 2023

View reviewed changes

atscott added target: patch This PR is targeted for the next patch release action: merge The PR is ready for merge by the caretaker labels Feb 27, 2023

atscott added the merge: caretaker note Alert the caretaker performing the merge to check the PR for an out of normal action needed or note label Feb 27, 2023

AndrewKushnir closed this in 7e35a91 Feb 27, 2023

angular-automatic-lock-bot bot locked and limited conversation to collaborators Mar 30, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(router): add error message when using loadComponent with an NgModule #49164

fix(router): add error message when using loadComponent with an NgModule #49164

Ivnosing commented Feb 22, 2023

atscott Feb 22, 2023

Ivnosing Feb 23, 2023

atscott Feb 23, 2023

ngbot bot commented Feb 27, 2023

AndrewKushnir commented Feb 27, 2023

angular-automatic-lock-bot bot commented Mar 30, 2023

fix(router): add error message when using loadComponent with an NgModule #49164

fix(router): add error message when using loadComponent with an NgModule #49164

Conversation

Ivnosing commented Feb 22, 2023

PR Checklist

PR Type

What is the current behavior?

What is the new behavior?

Does this PR introduce a breaking change?

Other information

atscott Feb 22, 2023

Choose a reason for hiding this comment

Ivnosing Feb 23, 2023

Choose a reason for hiding this comment

atscott Feb 23, 2023

Choose a reason for hiding this comment

ngbot bot commented Feb 27, 2023

AndrewKushnir commented Feb 27, 2023

angular-automatic-lock-bot bot commented Mar 30, 2023