Visual Studio 2019 - 添加客户端库（TypeScript、JQuery 等）的正确方法

Question

[2019 年 7 月 16 日编辑#1] 我很困惑。我正在尝试一个 .NET Core 3.x Web 应用程序，我想在其中使用：

• jQuery
• 打字稿

我已经让 TypeScript 工作了，但它拒绝理解 jQuery '$' 符号。

我已经通过 NuGet 添加了“DefinitelyTyped”库，但没有任何乐趣。

我认为我的困惑在于我应该如何添加这些客户端库。我尝试添加客户端库（通过右键单击解决方案），并将其放入 libman.json 文件中。还有一种使用package.json（我认为是node）的方法。

我真正想了解的是Visual Studio 2019的首选方式是什么。

关于具体问题（我确实可以通过一些“新手”指导来做到这一点）......

在依赖项下，我现在有：

NPN

• 德尔
• 吞咽
• jQuery
• jquery-ui

努格特

• jquery.TypeScript.DefinitelyTyped
• jqueryui.TypeScript.DefinitelyTyped Microsoft
• Microsoft.TypeScript.MSBuild

然后，在脚本下我有 example.ts

var example = {
    showGreeting: function(): void {
        alert("Hello user");
        let x: any = $('abc');
    }
};

example.showGreeting();

（这是无法识别“$”符号的地方）

tsconfig.json

{
  "compilerOptions": {
    "noImplicitAny": true,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5"
  },
  "files": [
    "./example.ts"
  ],
  "compileOnSave": true
}

libman.json

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": [
    {
      "provider": "unpkg",
      "library": "bootstrap@4.3.1",
      "destination": "wwwroot/lib/bootstrap/"
    }
  ]
}

包.json

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "dependencies": {
    "jquery": "3.4.1",
    "jquery-ui": "1.12.1"
  },
  "devDependencies": {
    "gulp": "4.0.2",
    "del": "5.0.0"
  }
}

编辑#1

我从 package.json 的“依赖项”部分中删除了客户端库，并将它们移至 libman.json 的库部分。它们正式从解决方案的“npm”依赖项下消失，现在出现在 wwwroot/lib 下。

libman.json

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": [
    {
      "provider": "unpkg",
      "library": "bootstrap@4.3.1",
      "destination": "wwwroot/lib/bootstrap/"
    },
    {
      "library": "jquery@3.4.1",
      "destination": "wwwroot/lib/jquery/"
    },
    {
      "library": "jqueryui@1.12.1",
      "destination": "wwwroot/lib/jqueryui/"
    }
  ]
}

包.json

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "dependencies": {
  },
  "devDependencies": {
    "gulp": "4.0.2",
    "del": "5.0.0"
  }
}

我认为这是朝着正确方向迈出的一步。

但是，TypeScript 仍然给我错误：

错误 TS2581：构建：找不到名称“$”。您需要安装 jQuery 的类型定义吗？

Answer 1

好的 - 现在可以工作了。以下定义了我必须安装的内容。

努格特

• Microsoft.TypeScript.MSBuild
• Microsoft.Web.LibraryManager.Build

Libman.json

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": [
    {
      "provider": "unpkg",
      "library": "bootstrap@4.3.1",
      "destination": "wwwroot/lib/bootstrap/"
    },
    {
      "library": "jquery@3.4.1",
      "destination": "wwwroot/lib/jquery/",
      "files": [
        "jquery.min.js",
        "jquery.min.map",
        "jquery.js",
        "core.js"
      ]
    }
  ]
}

包.json

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "dependencies": {
  },
  "devDependencies": {
    "gulp": "4.0.2",
    "del": "5.0.0",
    "@types/jquery": "3.3.30",
    "@types/jqueryui": "1.12.7"
  }
}