「AがBを輸入し、BがAを輸入する」という状況があります。
両方のファイルのコードを 1 つのファイルに入れ、ファイルの関連コンテンツの 1 つをファイルのほぼ先頭にある変数宣言 (定義ではない) に移動しました。
JS ビュー内で問題を実質的に解決しましたが、Redux ストアを含む変数は静的に型指定されていないため、この変数に関する他のファイルから警告が表示されます。
変数はファイルのほぼ先頭にあり、静的に型指定されていません。その定義を新しい関数の中に入れて静的に型付けしようとし、その関数のlet store: ReturnType<typeof buildMyStore>
場所を使用しようとしましbuildMyStore
た。
変数宣言( buildMyStore
const アロー関数) にはツールチップがあります
buildMyStore
any
戻り値の型の注釈がなく、戻り値の式の 1 つで直接的または間接的に参照されているため、暗黙的に戻り値の型があります。ts(7023)
store
変数宣言にはツールチップがあります:
store
自身の型注釈で直接的または間接的に参照されています。ts(2502)
質問に対する回答がない場合は、私ができる最も近い機能コードの変更を教えてください。
コード
const buildMyStore = (api) => {
return configureStore({
reducer: rootReducer,
middleware: getDefaultMiddleware =>
getDefaultMiddleware({
immutableCheck: false,
serializableCheck: false,
thunk: true
})
.concat([idleMiddleware as Middleware])
.concat([api.middleware as Middleware]),
devTools: process.env.NODE_ENV !== "production",
enhancers: [(reduxBatch as unknown) as StoreEnhancer],
preloadedState:
typeof window !== "undefined"
? (window as any).__PRELOADED_STATE__
: undefined
})
};
let store: ReturnType<typeof buildMyStore>;
const axiosBaseQuery = (...): someComplexTypeHere => async ({ url, method, data }) => {
// some code that uses store.getState().auth
};
const api = createApi(/* ...some code that uses axiosBaseQuery directly (not inside a callback)... */);
store = buildMyStore(api);
// exports here
更新 1
エクスポートには次のものが含まれます。
export const store;
export const { /* ... */ } = api;
export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;
更新 2
私はこれを一時的かつ部分的に解決したと思います:
let store: any;
しかし、これは TypeScript エラーをいくつかの他のエラーに変えます: コールバックのパラメータに対して特定の型が推論されたところで、推論された型がany
. これは避けたい。
アップデート 3
の署名axiosBaseQuery
:
const axiosBaseQuery = (
{ baseUrl }: { baseUrl: string } = { baseUrl: "" },
): BaseQueryFn<
{
url: string;
method?: AxiosRequestConfig["method"];
data?: AxiosRequestConfig["data"];
withAuth?: boolean;
},
unknown,
unknown
> => async ({ url, method, data, withAuth }) => {
// ...
};