フロー+ Redux：デフォルトデフォルトのアクションと強く型付けされたアクションのエラー

Question

フロードキュメント（https://flow.org/en/docs/frameworks/redux/）で提案されているように、フローティングディスジョイントユニオンを使用してreduxアクションオブジェクトを強くタイプしようとしていますが、 （@@redux/INIT,@@redux/PROBE_UNKNOWN_ACTIONなど）を処理するエラーを処理します。

このコードのサンプルでは、​​次のようになります。

// Constant action type strings 
export const INIT_STORIES: 'INIT_STORIES' = 'INIT_STORIES'; 
export const UPDATE_STORY: 'UPDATE_STORY' = 'UPDATE_STORY'; 

// Strongly typed action objects 
export type InitAction = { 
    type: typeof INIT_STORIES, stories: Array<Story> 
}; 
export type UpdateAction = { 
    type: typeof UPDATE_STORY, storyIndex: number, story: Story 
}; 

// Disjoint union wrapper 
export type ActionType = 
| InitAction 
| UpdateAction; 

//reducer 
export default function storiesReducer(
    stories: Array<Story> = [], 
    action: ActionType 
): Array<Story> { 
    // Error is thrown at function invocation, prior to the first inner line of function 
    // Uncaught TypeError: [tcomb] Invalid value {"type": "@@redux/INIT" 
    console.log(action); 
    ... 
} 

私は、この問題のために、オンラインで1の問題/解決策を見つけることができた、それは問題を解決するために、より複雑なフローのランタイムを使用しています。 （https://github.com/codemix/flow-runtime/issues/80）

ReduxとFlowを統合するために推奨される構文のように思えますが、もっと簡単な解決策が必要ですか？私は、関数のパラメータの型をactionと定義していない文字列型（つまり{ type: string }）のオブジェクトとの結合を解除しようとしましたが、静的なlinting/typingを持つ型エラーがスローされます。なぜなら、オブジェクトはactionオブジェクトです。

Answer 1

最も簡単な解決策は、Reduxのために完全なflow-typedパッケージをインポートせずに、以下のように、ActionTypeばらばら組合型にばらばら組合{ type: $Subtype<string> }を追加することです：

// Disjoint union wrapper 
export type ActionType = 
| InitAction 
| UpdateAction 
| { type: $Subtype<string> }; 


//reducer 
export default function storiesReducer(
    stories: Array<Story> = [], 
    action: ActionType 
): Array<Story> { 
    console.log(action); 
    ... 
} 

場合、これは適切なエラーをスローしませんがアクションタイプの文字列が間違って入力されました。すべての文字列タイプが許可されているため、スイッチ/ケースブロック内の異なるオブジェクト形状を適切な分岐で認識することができます。