kmaraz

if (ON_DEVELOPMENT) {
  // We are loading version of app which uses JIT
  require('./app.module');
}
else {
  // Here we want to load a special entry file for AOT
  require('./main.aot');
}

kmaraz

{
  "compilerOptions": {
    "baseUrl": "./",
    "target": "es5",
    "module": "esnext",
    "lib": ["es2018", "dom"],
    "moduleResolution": "node",
    "typeRoots": ["node_modules/@types"]
  }
}

kmaraz

{
  "compilerOptions": {
    "baseUrl": "./",
    "target": "es5",
    "module": "esnext",
    "lib": ["es2018", "dom"],
    "moduleResolution": "node",
    "typeRoots": ["node_modules/@types"]
  },
  "exclude": ["app/main.aot.ts"]

kmaraz

const path = require('path');
const AngularCompilerPlugin = require('@ngtools/webpack').AngularCompilerPlugin;

module.exports = (env, argv) => {

  const config = {
    plugins: [
      // See: https://www.npmjs.com/package/@ngtools/webpack
      new AngularCompilerPlugin({
        // We wanted to have separate tsconfig for AOT compilation

kmaraz

export const selectFeatureA = fromFeatureA.selectFeatureA;
export const selectFeatureB = fromFeatureB.selectFeatureB;
export const selectCombinedFeature = createSelector(selectFeatureA, selectFeatureB,
  (a, b) => a.find((x) => x.id === b.id)
);

kmaraz

export interface RegisterEffects { ngRegisterEffects(): void; }

export const EFFECTS_CLASS = new InjectionToken<RegisterEffects[]>('EFFECTS_CLASS');

export function EffectsProvider<T extends RegisterEffects>(
  effectsClass: Type<T>): ClassProvider {
  return {
    multi: true,
    provide: EFFECTS_CLASS,
    useClass: effectsClass

kmaraz

// The original AngularJs application
const ngModule = angular.module('admin', [
  // We are leaving all the old module untouched
  'ng1.modules',
  // We can downgrade Components, Directives, Services, etc.
  // And use them in the AngularJs app
  'ng2.modules'
]);

@NgModule({

kmaraz

// InjectionToken is a solution when choosing a provider token for non-class dependencies
// In this case we are redistering the reducers for this particular module
export const EVENTS_REDUCER_TOKEN = new InjectionToken<ActionReducerMap<fromEvents.State>>('Events');

// Map of our reducers
export function getReducers(): ActionReducerMap<fromEvents.State> {
  return {
    events: fromEvents.eventsReducer
  };
}

kmaraz

export function reducer(state: EventsState = initialState, action: Action): EventsState {
  switch (action.type) {
    case EventsActions.UPDATE: {
      // Clone the oridinal state to be sure, not to update the object reference
      const newState = cloneDeep(state);
      newState.events = action.payload;
      return newState;
    }
    case EventsActions.RESET: {
      return cloneDeep(initialState);

kmaraz

@Injectable()
export class EvnetsEffects implements RegisterEffects {

  // Effects would not work by default in the hybrid application,
  // therefore we need to preload them during the bootstrap of our app.
  // See: app.module.ts and app.effects.ts examples.
  @Effect()
  deleteEvent$: Observable<EventsActions.All> = this.actions$
    .ofType<EventsActions.DeleteEvent>(EventsActions.DELETE_EVENT)
    .pipe(