Thabo
Thabo

Reputation: 1465

@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).

Upvotes: 1

Views: 1225

Answers (2)

Thabo
Thabo

Reputation: 1465

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/*"] },
 }

Upvotes: 0

KiraAG
KiraAG

Reputation: 783

Do not manually call the combineReducers function. As mentioned here, you can try and use actionReducerMap for your reducers and pass it to StoreModule.forRoot(reducers)

See this link for implementation

Upvotes: 1

Related Questions