TS2307：找不到模块“react-bootstrap”

Question

我有一个带有 webpack 的新 React 项目，并尝试向其中添加“react-bootstrap”并呈现警报作为测试。

所以我做了：

npm install react-bootstrap --save

并已验证文件是否存在。在我的主 tsx 文件中，我有：

import { Alert } from 'react-bootstrap';
...
<Alert variant='success'>Success Alert</Alert>

当我运行 npm start 来启动我的服务器时，它会渲染页面并显示成功警报，效果非常好，但 webpack 错误提示如下：

[tsl] ERROR in ....\src\client-react\components\Header.tsx(9,23)
      TS2307: Cannot find module 'react-bootstrap'.

即使警报在下面正确显示（并且如果我破解 css 以使错误提示上显示：没有，它在下面看起来绝对没问题？

我认为这是因为react-bootstrap包中没有任何@types（@types/react-bootstrap适用于旧版本，因为他们显然已将类型滚动到主包中）但我不确定如何修复。

谢谢！

Answer 1

我正在查看react-bootstrap使用 Typescript 提供的示例。这里的方法是将包导入为index.tsx：

import "bootstrap/dist/css/bootstrap.min.css";

我希望您有react-app-env.d.ts引用react-scripts类型的文件，如果不创建并添加该文件，则会自动生成

/// <reference types="react-scripts" />

因此，在您的Hello.tsxAlert中，您可以从以下位置导入react-bootstrap：

import Alert from 'react-bootstrap/Alert';