在 TypeScript 中找不到模块的声明文件

Posted 2023-03-13

【中文标题】在 TypeScript 中找不到模块的声明文件

【英文标题】：Could not find a declaration file for module in TypeScript

【发布时间】：2020-08-02 17:07:44

【问题描述】：

我在我的网络应用程序中使用 react-facebook-login 库和 TypeScript。我还安装了@types/react-facebook-login。当我像这样导入库时，一切正常：

import ReactFacebookLogin from 'react-facebook-login'

但是，这个库允许导入没有任何样式的组件（这就是我想要的）：

import ReactFacebookLogin from 'react-facebook-login/dist/facebook-login-render-props'

在这种情况下会出现错误：

找不到模块“react-facebook-login/dist/facebook-login-render-props”的声明文件

我的tsconfig.json 是用create-react-app app --template typescript 创建的：

  "compilerOptions": 
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  ,
  "include": [
    "src"
  ]

有什么办法可以解决吗？

【参考方案1】：

?

只需将以下代码添加到react-app-env.d.ts。

declare module 'react-facebook-login/dist/facebook-login-render-props' 
  export interface RenderProps 
    onClick:
      | ((event: React.MouseEvent<htmlButtonElement, MouseEvent>) => void)
      | undefined;
    isDisabled: boolean;
    isProcessing: boolean;
    isSdkLoaded: boolean;
  

  interface ReactFacebookLoginProps 
    appId: string;
    callback(userInfo: ReactFacebookLoginInfo): void;
    onFailure?(response: ReactFacebookFailureResponse): void;

    autoLoad?: boolean;
    buttonStyle?: React.CSSProperties;
    containerStyle?: React.CSSProperties;
    cookie?: boolean;
    cssClass?: string;
    disableMobileRedirect?: boolean;
    fields?: string;
    icon?: string | React.ReactNode;
    isDisabled?: boolean;
    language?: string;
    onClick?(event: React.MouseEvent<HTMLDivElement>): void;
    reAuthenticate?: boolean;
    redirectUri?: string;
    scope?: string;
    size?: 'small' | 'medium' | 'metro';
    textButton?: string;
    typeButton?: string;
    version?: string;
    xfbml?: boolean;
    isMobile?: boolean;
    tag?: Node | React.Component<any>;
    render(props: RenderProps): void;
  

  interface ReactFacebookFailureResponse 
    status?: string;
  

  interface ReactFacebookLoginInfo 
    id: string;
    accessToken: string;
    name?: string;
    email?: string;
  

  interface ReactFacebookLoginState 
    isSdkLoaded?: boolean;
    isProcessing?: boolean;
  

  export default class ReactFacebookLogin extends React.Component<
    ReactFacebookLoginProps,
    ReactFacebookLoginState
  >