[@ngrx] AoT not working

[Itrulia]

Version

@ngrx version: 4.0.5
@angular: 4.3.6
angular/cli: 1.3.2

Error

When I try to compile Angular with AoT I get the following error:

ERROR in Error encountered resolving symbol values statically. Calling function 'createMetaReducer', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol analyticsMetaReducer in ...

Code

I tried the following 3 versions (googled a bit and found people that did it like that but with other libraries):

Version 1

import {createMetaReducer} from "redux-beacon";
import {GoogleAnalytics, PageView} from "redux-beacon/targets/google-analytics";
import {logger} from "redux-beacon/extensions/logger";
import {Action, compose, combineReducers} from "@ngrx/store";
import {ROUTER_NAVIGATION} from "@ngrx/router-store";

const pageView = (action: any): PageView => ({
  hitType: "pageview",
  page: action.payload.event.url,
});

export const eventsMap = {};
eventsMap[ROUTER_NAVIGATION] = pageView;

export const analyticsMetaReducer = compose(
  combineReducers,
  createMetaReducer(eventsMap, GoogleAnalytics, {logger: logger})
);

Version 2

import {createMetaReducer} from "redux-beacon";
import {GoogleAnalytics, PageView} from "redux-beacon/targets/google-analytics";
import {logger} from "redux-beacon/extensions/logger";
import {Action, compose, combineReducers} from "@ngrx/store";
import {ROUTER_NAVIGATION} from "@ngrx/router-store";

const pageView = (action: any): PageView => ({
  hitType: "pageview",
  page: action.payload.event.url,
});

export const eventsMap = {};
eventsMap[ROUTER_NAVIGATION] = pageView;

export const analyticsMetaReducer = createMetaReducer(eventsMap, GoogleAnalytics, {logger: logger});

Version 3

import {createMetaReducer} from "redux-beacon";
import {GoogleAnalytics, PageView} from "redux-beacon/targets/google-analytics";
import {logger} from "redux-beacon/extensions/logger";
import {Action, compose, combineReducers} from "@ngrx/store";
import {ROUTER_NAVIGATION} from "@ngrx/router-store";

const pageView = (action: any): PageView => ({
  hitType: "pageview",
  page: action.payload.event.url,
});

export const eventsMap = {};
eventsMap[ROUTER_NAVIGATION] = pageView;

export const analyticsMetaReducer = (reducer) => createMetaReducer(eventsMap, GoogleAnalytics, {logger: logger})(reducer);

[ttmarek]

Hi @Itrulia.

Thanks for opening an issue. I've been a bit removed from the Angular/AOT world for the last little while, so I can't provide a solution off the top of my head. I have however had a similar issue with one of our older analytics libraries. Take a look at: rangle/redux-gtm#39. Perhaps there is something in there that might help?

If not, I'll see who I can draw up to help that has more experience with AOT than I do.

One last thing that might help us work towards a solution. Is this a new issue that came about from a new AOT version? Or is that something you wouldn't know because you've just added redux-beacon to your project?

[Itrulia]

Hey,

I also saw that issue and tried that, unfortunately I was not able to fix it. I just added redux-beacon (love it so far) and thus I unfortunately don't know if it's new.

I can look in to it this weekend if I dont have too much todo if wanted.

[ttmarek]

Okay cool. Yeah, let us know if you end up finding a solution on your own. I may have some time later this week to take a look myself if I can't bribe anyone else to help out 😉

[JacekKosciesza]

I have the same problem and it seems that it's something new (it was working in the previous versions).

[JacekKosciesza]

Ok, trick described here: rangle/redux-gtm#39 did the job.

const gaMetaReducer = createMetaReducer(eventsMap, GoogleAnalytics);
const gaFinalMetaReducer = gaMetaReducer(routerReducer);
export function analyticsMetaReducer(state: any, action: any) {
   return gaFinalMetaReducer(state, action);
}

[ttmarek]

Cool, thanks for posting what worked for you @JacekKosciesza.

Did this work for you as well @Itrulia?

[Itrulia]

Currently not working on the site anymore. But I guess if it works for him, it will also work for others. Might be worth documenting though :)

[ttmarek]

An FAQ section was added to the new docs with this information: https://rangle.gitbook.io/redux-beacon/faq