1

「AがBを輸入し、BがAを輸入する」という状況があります。

両方のファイルのコードを 1 つのファイルに入れ、ファイルの関連コンテンツの 1 つをファイルのほぼ先頭にある変数宣言 (定義ではない) に移動しました。

JS ビュー内で問題を実質的に解決しましたが、Redux ストアを含む変数は静的に型指定されていないため、この変数に関する他のファイルから警告が表示されます。

変数はファイルのほぼ先頭にあり、静的に型指定されていません。その定義を新しい関数の中に入れて静的に型付けしようとし、その関数のlet store: ReturnType<typeof buildMyStore>場所を使用しようとしましbuildMyStoreた。

変数宣言( buildMyStoreconst アロー関数) にはツールチップがあります

buildMyStoreany戻り値の型の注釈がなく、戻り値の式の 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 }) => {
   // ...
};
4

0 に答える 0