0

I am trying to learn NGXS and, therefore, following a tutorial. The tutorial said to install ngxs store and other dependencies, and I did with:

npm install @ngxs/store --save; 
npm i @ngxs/logger-plugin --save; 
npm i @ngxs/devtools-plugin --save-dev

But after doing that, my code will not work and says there is a problem with my app.module.ts:

'NgxsRootModule' does not appear to be an NgModule class. 'NgxsLoggerPluginModule' does not appear to be an NgModule class. 'NgxsReduxDevtoolsPluginModule' does not appear to be an NgModule class.

Here is my app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import { NgxsModule } from '@ngxs/store';
import { NgxsLoggerPluginModule } from '@ngxs/logger-plugin';
import { NgxsReduxDevtoolsPluginModule } from '@ngxs/devtools-plugin';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    NgxsModule.forRoot([]), NgxsLoggerPluginModule.forRoot(), NgxsReduxDevtoolsPluginModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Does anyone have any idea on how this could be solved, please? I tried a lot of things already, such as restarting VSCode and deleting node_modules and running npm i again, to no results.

Thanks in advance!

igryn
  • 13
  • 3

2 Answers2

0

I found the solution on a different stackoverflow post:

error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class

"Your module is not yet loaded by the Angular Server in node ng serve, so restart your server so the server loads the module that you just added in @NgModule app.module.ts"

So you just need to start the project with the imports and without implementation. And then you can add them in the @NgModule.

Dominik Ranters
  • 1
0

For Angular/core 15.2.2 there was a breaking change that the NGXS team was aware of, but thought wasn't coming until Angular 16. It centered around NGCC and eivyEnabled

They currently have a fix for the issue, but it is still pending merge and release in the next V3.Minor-Version.

An immediate work around is to either downgrade Angular version to 15.0 or install the @dev branch version of NGXS until the next release of V3 linked above (as of 03.18.2023)

npm install @ngxs/store@dev --save

Doing the above, I currently have it working with the following:

"@angular/core": "^15.2.2"
"@ngxs/store": "^3.7.6-dev.master-4d7e301"
Mosquito
  • 1
  • 1