Useful or not, from you.
angular Conditional Module imports (e.g. for development only)

<!--๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…

Oh hi there! ๐Ÿ˜„

To expedite issue processing please search open and closed issues before submitting a new one. Existing issues often contain information about workarounds, resolution, or progress updates.

๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…๐Ÿ”…-->

๐Ÿš€ Conditional Module imports (e.g. for development-only modules)

Relevant Package

<!-- Can you pin-point one or more @angular/* packages the are relevant for this feature request? --> <!-- โœ๏ธedit: --> This feature request is for @angular/core / ivy

Description

View Engine allowed us to pass a module conditionally, which was useful as some modules should only be imported in development. Example:

@NgModule({
  imports: [
    process.env.NODE_ENV === 'development' ? NgxsReduxDevtoolsPluginModule.forRoot({})  : undefined
  ]
})

Using Ivy, the above solution will fail when building with production target. Running ng serve xxx --prod leads to these errors: CLI will show lots of misguiding errors (telling me component xxx is not a known element). Browser console will show "ASSERTION ERROR: Type passed in is not NgModuleType, it does not have 'ษตmod' property."

I thought Ivy might not like the undefined value, so I tried this as a workaround:

@NgModule()
export class NoopModule {}

@NgModule({
  imports: [
    process.env.NODE_ENV === 'development' ? NgxsReduxDevtoolsPluginModule.forRoot({})  : NoopModule 
  ]
})

... which lead to the same errors.

Describe the solution you'd like

Does Ivy support this by now, in way I don't know? if not, I suggest to allow to pass undefined to module imports.

That's a useful answer
Without any help

I face the same issue, to make the project works I have to disable ivy "enableIvy": false

.... - error NG1010: Value at position 28 in the NgModule.imports of ChildModule is not a reference: [object Object]

202     imports: [
                 ~
203         MatDialogModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~
... 
257         MatSidenavModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~~
258     ],
    ~~~~~
.... - error NG6002: Appears in the NgModule.imports of ParentModule, but could not be resolved to an NgModule class.
...

This is my module

@NgModule({
    imports: [
        MatDialogModule,
        CommonModule,
        ...
       // This conditional import cause the issue
        environment.isMockEnabled
            ? HttpClientInMemoryWebApiModule.forFeature(FakeApiService, {
                  passThruUnknownUrl: true,
                  dataEncapsulation: false,
              })
            : [],
        ...
        MatSidenavModule,
    ],
    declarations: [ChildComponent],
})
export class ChildModule {}