如何将react-bootstrap添加到ASP.NET项目

Question

所以，我是ASP.NET MVC的新手。

我有一个ASP.NET MVC的网页应用程序，我正在尝试将react-bootstrap添加到其中。它已经在使用React/ReactDOM。

我做了：

         npm install --save react-bootstrap

React-Bootstrap已经在项目的node_modules文件夹中。

我在Package.json文件的依赖中添加了React-Bootstrap。

         "dependencies": {
           ......
           "react-bootstrap": "^0.30.0"
         }, 

我在webpack.config.js文件的外部变量中添加了react-bootstrap。

        externals:
        {
         'react-bootstrap':
           {
            "var": 'ReactBootstrap',
            web: 'ReactBootstrap',
            root: 'ReactBootStrap',
            commonjs2: 'ReactBootstrap',
            commonjs: 'ReactBootstrap',
            amd: 'ReactBoostrap'
           },
        .....
        }

在Layout.cshtml中，我添加了一个带有src属性的script标签，指定了node_modules文件夹中reactbootstrap.js文件的位置。

        <script src="@Url.Content("~/node_modules/react-bootstrap/dist/react-bootstrap.min.js")"></script>

但是当我这样做时

       import * as ReactBootStrap from 'react-bootstrap';

在Dashboard.tsx文件中，它说找不到该模块。

缺少什么？

- AliciaGuerra

Answer 1

尝试这个：npm i @types/react-bootstrap --save。

- Johan O

---

命令行输出为 @types/react-bootstrap@0.0.48 node_modules@types\react-bootstrap。 - MarisolFigueroa

@typesreact/react@15.0.23 - MarisolFigueroa

Answer 2

所以，我解决了这个问题。要添加另一个包，TypeScript需要添加一个声明文件。这些文件通常具有.d.ts扩展名，并定义您正在添加的包中的函数、类、接口等的原型。过去，这些需要手动创建，但最近基于npm的包可以由新的TypeScript处理。还有一个常用的TypeScript声明文件存储库（NuGet和DefinitelyTyped）

在Visual Studio的包管理器控制台中，您可以执行以下操作：

Install-Package react-bootstrap.TypeScript.DefinitelyTyped

- MarisolFigueroa