静态解析符号时遇到错误

Question

我有一个使用 ngrx 的 Angular4 应用程序。我创建了一个撤消高阶减速器，如 on the redux website 所述。

不幸的是，当我在 root.reducers.ts 文件中应用此功能时，我遇到了提前 (AoT) 编译问题，并收到此错误

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

当 AoT 关闭或文件被修改后，代码可以完美运行，在这种情况下使用即时编译。

我之前尝试过使用ngrx-undo，但它似乎不起作用，这就是我推出自己的解决方案的原因。

我尝试查看其他 stackoverflow 帖子并搜索 google，但大多数其他问题似乎与 3rd 方库或自定义组件有关，在这种情况下不相关。

我知道我可以通过删除高阶 reducer 并将 cartReducer 直接转换为可撤消来解决此问题，但这是不可取的，因为如果我们使任何其他 reducer 可撤消，我们将有很多代码重复。

如何解决此错误？最好不要删除 AoT 编译，因为一旦我们投入生产，就需要这样做。

代码：

See Gist for complete code

root.reducers.ts

import { sessionReducer } from './reducers/session.reducers';
import { cartReducer } from './reducers/cart.reducer';
import { undoable } from './reducers/undo.reducer';
import { paymentReducer } from './reducers/payment.reducer';
import { accountReducer } from './reducers/account.reducer';
import { productReducer } from './reducers/product.reducer';
import { errorReducer } from './reducers/error.reducer';

export const rootReducer = {
  session: sessionReducer,
  cart: undoable(cartReducer),
  payment: paymentReducer,
  account: accountReducer,
  product: productReducer,
  error: errorReducer
};

Answer 1

最后我将大部分 undo reducer 代码抽象为单独的函数，并返回一个构建特定 reducer 的函数。这似乎解决了问题

在购物车.reducer.ts 中

const initialState: UndoState<CartState> = buildInitialState(initialCartState);
export function undoableCartReducer(state = initialState, action): UndoState<CartState> {
    return handleAction(state, action, cartReducer);
}

在 undo.reducer.ts 中

export function buildInitialState<S>(state: S): UndoState<S> {
    return {
        past: [],
        present: state,
        future: []
    };
}

export function delegate<S>(state: UndoState<S>, action, reducer: ActionReducer<S>): UndoState<S> {
    const {past, present, future} = state;
    const newPresent = reducer(present, action);
    if (present === newPresent) {
       return state;
    }
    return {
        past: [...past, present],
        present: newPresent,
        future: []
    };
}

export function handleAction<S>(state: UndoState<S>, action, reducer: ActionReducer<S>): UndoState<S> {
    switch (action.type) {
        case 'UNDO':
            return undo(state);
        case 'REDO':
            return redo(state);
        default:
            return delegate(state, action, reducer);
    }
}

新的 root.reducers.ts

export const rootReducer = {
  session: sessionReducer,
  cart: undoableCartReducer,
  payment: paymentReducer,
  account: accountReducer,
  product: productReducer,
  error: errorReducer
};