在 ASP.NET Core 应用程序中编译打字稿时如何包含引导表的类型

Posted 2023-03-13

【中文标题】在 ASP.NET Core 应用程序中编译打字稿时如何包含引导表的类型

【英文标题】：how to include types for bootstrap-table when compiling typescript in an ASP.NET Core app

【发布时间】：2021-10-06 21:20:22

【问题描述】：

我正在编写一个 ASP.NET Core 5 应用程序，而不是使用 JS，我想使用 TypeScript。

我正在使用一些 JS 库，所以为了让 TS 编译它需要为它们定义。

我已经使用库的类型定义的 devDependencies 设置了 NPM，它将它们下载到 node_modules，TS 编译器会找到并使用它们。

我的 NPM package.json 是：

    "version": "1.0.0",
    "name": "asp.net",
    "private": true,
    "devDependencies": 
        "@types/bootstrap": "5.0.17",
        "@types/jquery": "3.5.6",
        "bootstrap-table": "^1.18.3",
        "jquery": "3.6.0"
    

我的tsconfig.json 是：

    "compilerOptions": 
        "noImplicitAny": true,
        "noEmitOnError": true,
        "removeComments": true,
        "sourceMap": true,
        "target": "es5",
        "lib": [
            "DOM",
            "ES5",
            "ES2015"
        ]
    ,
    "include": [
        "wwwroot/js/**/*.ts"
    ],
    "exclude": [
        "node_modules"
    ],
    "compileOnSave": true

这适用于 JQuery 和 Bootstrap，但不适用于 bootstrap-table。

我的项目结构是：

root
  wwwroot
    js
      home.ts
  views
    home
      index.cshtml      // imports ~/js/home.js
  node_modules          // the folders in here are automatically maintained by NPM
    @types
      bootstrap
      jquery
    bootstrap-table
  package.json
  tsconfig.json

编译home.ts时的错误是(TS) Property 'bootstrapTable' does not exist on type 'JQuery<HTMLElement>'.

我认为问题可能是由于 bootstrap-table 的类型定义包含在主库中，这意味着它不在 node_modules 的 @types 子目录中。

我尝试通过手动指定 typeRoots 来强制 TS 编译器查看它，但只有很多编译错误，因为它开始将所有子文件夹视为缺少的模块。

【参考方案1】：

是的，如果你只是想使用 bootstrap-table 插件，你可以使用 add -client 库直接下载插件：

或者直接使用CDNjs节点：

https://cdnjs.com/libraries/bootstrap-table

【讨论】：

下载库和类型定义，但不解决让 TS 编译器查看库文件夹中的定义