Search code examples
angularngrxngrx-store

@ngrx/store Error on production build : Error during template compile of 'Store'


The error:

ERROR in ../@ngrx/store/store.ts(10,2): Error during template compile of 'Store'
Could not resolve @angular/core relative to /home/teebo/Development/node_modules/@ngrx/store/store.d.ts..

I am on Angular v6, and @ngrx/store 6.1.0.

I am exporting some reducers form ./reducers/ui/index.ts like

export const uiReducers = combineReducers({
  formFields: fromFormFieldsReducer.reducer,
  forms: fromFormReducers.reducer,
  formGroups: fromFormGroupReducer.reducer
});

And then in appState.reducers.ts I have exports as follows

import { ActionReducerMap } from '@ngrx/store';
import { uiReducers } from './reducers/ui';
import { UIState } from './models/ui.model';
import { InjectionToken } from '@angular/core';

export interface AppState {
  ui: UIState;
}

export const reducerToken = new 
 InjectionToken<ActionReducerMap<AppState>>('Reducers');

 export function getReducers() {
   return { ui: uiReducers };
 }

 export const reducerProvider = [
   { provide: reducerToken, useFactory: getReducers }
 ];

And then in my app.module.ts I have the following

...
import { StoreModule, MetaReducer } from '@ngrx/store';
import { reducerToken, reducerProvider } from 
 './state_store/appState.reducers'; 
...
imports: [..., StoreModule.forRoot(reducerToken),...]
...
providers: [..., reducerProvider, ...]                             

But running the following npm script

"build:ssr": "npm run build:client-and-server-bundles && npm run 
 webpack:server",

I get the error

ERROR in ../@ngrx/store/store.ts(10,2): Error during template compile of 'Store'
Could not resolve @angular/core relative to /home/teebo/Development/node_modules/@ngrx/store/store.d.ts..

Any assistance with this issue would be much appreciated, thanks. I have followed do me threads on github to track the issue like this one

As doing it with a ActionReducerMap without the provider gives me

ERROR in app/app.module.ts(64,25): Error during template compile of 
'AppModule'
 Function calls are not supported in decorators but 'combineReducers' 
 was called in 'appStateReducers'
 'appStateReducers' references 'uiReducers' at 
 app/state_store/appState.reducers.ts(9,67)
  'uiReducers' calls 'combineReducers' at 
app/state_store/reducers/ui/index.ts(8,27).

Solution

  • I have found a solution to the issue by specifying in the tsconfig.app.json the path to the node_modules, the build with the --prod now works. The change I have made is as follows in the compiler options

    "compilerOptions": {
      "baseUrl": ".",
      "paths": { "@angular/*": ["../node_modules/@angular/*"] },
     }