无法在 TypeScript 中导入模块

Question

我知道有很多主题是关于如何通过 NPM 将依赖项导入 TypeScript 的。我尝试执行以下操作

npm install --save node-fetch

然后 import * as fetch from 'node-fetch 在我的 app.ts.

为了在我的代码中使用 fetch。

但是我无法在我的代码中使用该库，并且出现以下错误：

Error TS2307 (TS) Cannot find module 'node-fetch'.

我查看了 node_modules 下加载的模块并在那里找到了 node-fetch，因此我假设 lib 已成功安装。许多提到的主题还提到了一些 tsconfig 文件，我无法在我的项目中找到它。 VS 似乎对如何实现 TypeScript 的设置有自己的想法，这些设置位于我的 csproj 文件中：

<TypeScriptLib>es2015</TypeScriptLib>
<TypeScriptTarget>ES5</TypeScriptTarget>
<TypeScriptJSXEmit>None</TypeScriptJSXEmit>
<TypeScriptModuleKind>ES2015</TypeScriptModuleKind>
<TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
<TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
<TypeScriptRemoveComments>False</TypeScriptRemoveComments>
<TypeScriptOutFile />
<TypeScriptOutDir />
<TypeScriptGeneratesDeclarations>False</TypeScriptGeneratesDeclarations>
<TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
<TypeScriptSourceMap>True</TypeScriptSourceMap>
<TypeScriptMapRoot />
<FilesToIncludeForPublish>AllFilesInTheProject</FilesToIncludeForPublish>

我也为其他库得到了这个，例如leaflet-geosearch。

这是我的 package.json:

{
  "name": "myproject",
  "version": "1.0.0",
  "devDependencies": {
    "@types/d3": "^5.7.2",
    "@types/jquery": "^3.3.32",
    "@types/leaflet": "^1.5.8",
    "@types/leaflet-geosearch": "^2.7.1",
    "d3": "^5.15.0",
    "jquery": "^3.4.1",
    "leaflet": "^1.6.0",
    "leaflet-geosearch": "^2.7.0",
    "node-fetch": "^2.6.0"
  }
}

我已经删除了全局 npm-modules，如所示，并再次将 node-fetch 安装到本地项目中，但无济于事。

Answer 1

TL;DR

您缺少 node-fetch 的类型，您应该像这样安装它们：

npm i --save-dev @types/node-fetch

说明

一些包带有自己的打字，一些将打字作为单独的包发布，另一些则有第三方创建的打字（node-fetch 包是 created by David Frank, whereas the @types/node-fetch is maintained by DefinitelyTyped and the node-fetch types have been created by many people), some packages have no public typings at all (usually more isoteric packages) and you can create your own typings declarations。

其他一些观察结果

随意跳过...

您似乎混淆了 dependencies 和 devDependencies。 dependencies 应包括运行时应存在的所有包（例如 node-fetch 在您的情况下），而 devDependencies 是构建时所需的附加依赖项（例如，任何 @types 包或任何仅用于构建项目的包，如 webpack/grunt（如果适用）。

所以所有这些，可能应该移动到 dependencies:

"d3": "^5.15.0",
"jquery": "^3.4.1",
"leaflet": "^1.6.0",
"leaflet-geosearch": "^2.7.0",
"node-fetch": "^2.6.0"

最后，如果这是一个 nodejs（即不是基于浏览器的项目）项目，您可能应该使用 CommonJS 或 ES6 模块类型而不是 ES2015。参见 here。如果它是浏览器项目，您可能不应该使用 node-fetch；而是将 DOM 添加到您的打字稿库列表中，并使用从 window.fetch 或仅 fetch 获取，因为它将成为全局范围的一部分。

无法在 TypeScript 中导入模块

cannot import module in TypeScript

typescript

visual-studio-2017

TL;DR

其他一些观察结果