Angular 6アプリをビルドしようとしています。--prod
を使用すると次のエラーが発生します
ERROR in Error during template compile of 'AppModule'
Expression form not supported in 'reducers'
'reducers' contains the error at app/app.module.ts(48,3).
app.module.ts
import AuthEffects from './store/auth/auth.effects';
import ContentEffects from './store/content/content.effects';
import NavigationEffects from './store/navigation/navigation.effects';
import ConfigEffects from './store/config/config.effects';
import { ICommonAppState } from './app.state';
import { reducer as authReducer, key as authKey } from './store/auth';
import { reducer as configReducer, key as configKey } from './store/config';
import { reducer as contentReducer, key as contentKey } from './store/content';
import { reducer as navigationReducer, key as navigationKey } from './store/navigation';
import { PageContainerComponent } from './page-container/page-container.component';
import { BenefitsComponent } from './+benefits/benefits.component';
import { NavigationComponent } from './navigation/navigation.component';
const enhancers = [];
if (!environment.production) {
enhancers.Push(StoreDevtoolsModule.instrument({ maxAge: 10 }));
}
export const reducers: ActionReducerMap<ICommonAppState> = {
[authKey]: authReducer,
[configKey]: configReducer,
[navigationKey]: navigationReducer,
[contentKey]: contentReducer,
};
const effects = [AuthEffects, ConfigEffects, NavigationEffects, ContentEffects];
@NgModule({
declarations: [AppComponent, NavigationComponent, PageContainerComponent, BenefitsComponent],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
SharedComponentsModule,
StoreModule.forRoot(reducers),
EffectsModule.forRoot(effects),
...enhancers,
],
providers: [
{ provide: APP_BASE_HREF, useValue: '/content-manager/' },
{ provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true },
DiscoveryService,
AuthService,
JWTService,
ConfigService,
ContentService,
NavigationService,
TenantGuard,
AuthGuard,
],
bootstrap: [AppComponent],
})
export class AppModule {}
エラーが報告されている48行目は、
export const reducers: ActionReducerMap<ICommonAppState> = {
[authKey]: authReducer,
[configKey]: configReducer,
[navigationKey]: navigationReducer,
[contentKey]: contentReducer,
};
Angular 6 with NgRX 6を使用しています。これが機能しない理由がわかりません。ドキュメントに従っていますが、prod
を使用しない場合、アプリケーションは問題なくビルドされます。フラグ。ただし、ビルドは肥大化して遅くなりますが、AOT
ビルドをお勧めします。
同じ問題がありました...インジェクショントークンを使用してActionReducerMapを提供してみてください。
export const reducers: ActionReducerMap<ICommonAppState> = {
[authKey]: authReducer,
[configKey]: configReducer,
[navigationKey]: navigationReducer,
[contentKey]: contentReducer,
};
export const REDUCERS_TOKEN = new InjectionToken<ActionReducerMap<ICommonAppState>>('App Reducers');
export const reducerProvider = { provide: REDUCERS_TOKEN, useValue: reducers };
そして、このように使用します
imports: [
...
StoreModule.forRoot(REDUCERS_TOKEN, { metaReducers }),
...
],
providers: [reducerProvider]
そして、AOTコンパイラーは、コードを静的に(実行せずに)分析できるようになるはずです。
私も同じエラーに直面しました、そして私の場合、それは私のモジュールのタイプミスでした。モジュールのプロバイダーの配列に1つのコンマ「、」がありました。 contentReducerの後のコンマをコードから削除してみてください。