如何將 redux-persist 添加到 typescript 項目？

Question

我正在嘗試將 redux-persist 添加到我的 React 項目中（使用打字稿）。 但我有一些麻煩。 編譯出現以下錯誤：

Could not find a declaration file for module 'redux-persist/lib/storage'. '.../WebstormProjects/catalog/node_modules/redux-persist/lib/storage/index.js' implicitly has an 'any' type.
  Try `npm install @types/redux-persist` if it exists or add a new declaration (.d.ts) file containing `declare module 'redux-persist/lib/storage'

我安裝了以下軟件包：“@types/redux-persist”：“^4.3.1”和“redux-persist”：“^6.0.0”。

redux-persist/lib/storage 的內容：

declare module "redux-persist/es/storage" {
  import { WebStorage } from "redux-persist/es/types";

  const localStorage: WebStorage;
  export default localStorage;
}

declare module "redux-persist/lib/storage" {
  export * from "redux-persist/es/storage";
  export { default } from "redux-persist/es/storage";
}

怎么做才能解決這個問題？

Answer 1

解決方案：

添加這一行：

/// <reference types="redux-persist" />

react-app-env.d.ts如果您使用create-react-app 。

解釋：

打字稿中的三斜杠指令是包含單個 XML 標記的單行注釋。 注釋的內容用作編譯器指令。

這些指令用於聲明對包的依賴，包可以是類型、庫、路徑等。

解析這些包名的過程類似於在 import 語句中解析模塊名的過程。 將三斜杠引用類型指令視為聲明包的導入的一種簡單方法。

例如，在上面的代碼中，在聲明文件中包含/// <reference types="redux-persist" />聲明該文件使用在@types/node/redux-persist.d.ts中聲明的名稱； 因此，這個包需要與聲明文件一起包含在編譯中。

在這里閱讀更多。

Answer 2

解決方案：

從“redux-persist/es/storage”導入存儲的導入存儲，而不是從“redux-persist/lib/storage”導入存儲