reactjs - 不能用 typescript 做模块扩充

Question

我只是按照说明将正确的类型添加到我的 react-i18next 实例中，如下所述: https://react.i18next.com/latest/typescript#create-a-declaration-file

但是，在创建提到的 react-i18next.d.ts 文件后，我开始收到有关模块 react-i18next 未导出成员的错误，例如使用翻译钩子(Hook):

Module '"react-i18next"' has no exported member 'useTranslation'.ts(2305)

这是我的react-i18next.d.ts 文件的内容

// import the original type declarations
import 'react-i18next';
// import all namespaces (for the default language, only)
import translation from 'locales/en/translation.json';
import toast from 'locales/en/toasts.json';

// react-i18next versions lower than 11.11.0
declare module 'react-i18next' {
  // and extend them!
  interface Resources {
    translation: typeof translation;
    toast: typeof toast;
  }
}

declare module 'react-i18next' {
  // and extend them!
  interface CustomTypeOptions {
    // custom namespace type if you changed it
    defaultNS: 'translation';
    // custom resources type
    resources: {
      translation: typeof translation;
      toast: typeof toast;
    };
  }
}

我正在使用 typescript@4.4.4

Answer 1

出于某种原因，似乎类型定义文件和使用它的实际源代码不能存在于同一个文件夹中。我刚刚将类型定义文件移动到 types 文件夹，后者包含在 tsconfig.json 中，现在它可以完美运行:

// tsconfig file
"include": ["./src/**/*", "./types"],

root/
├─ src/
├─ types/
│  ├─ react-i18next.d.ts
├─ tsconfig.json