用于导入类型定义而不是主模块的 TypeScript 字符串

Question

我正在尝试导入一个模块，以及通过 DefinitelyTyped 从其类型定义包中导入一些类型。我安装了两个：

npm i -D leaflet
npm i -D @types/leaflet

（这将是一个传单插件，需要传单作为 peerDependency，因此传单本身需要 -D）。

在 .ts 文件的顶部，我尝试导入这些：

import L from 'leaflet';
import type { LatLng } from 'leaflet'

但是打字稿告诉我 Module '"/Users/seth/Documents/GitHub/leaflet-topography/node_modules/@types/leaflet/index"' has no default export.ts(1192)。没错，但我不是要从类型定义中导入 L，而是要从传单包本身导入。为什么打字稿假设这是一个类型定义？我怎样才能改变它，以便我导入的 L 是传单库本身？

Answer 1

根据您的构建引擎/TypeScript 编译器的配置方式，您可能需要将其写为：

import * as L from "leaflet";

Answer 2

Why is typescript assuming that this is a type definition?

d.ts 文件或类型 Declaration files 的全部目的是为打字稿提供有关 JavaScript 中编写的 API 的类型信息。您仍在阅读 leaflet 包，但打字稿编译器将寻找 API 的类型定义文件以在打字稿平台下工作。这将有助于使用 d.ts 文件中定义的类型注释进行所有静态类型分析的打字稿。

当您安装 @typings for leaflet 时，它将成为打字稿的一部分 eco-system。

How can I change that so that the L that I'm importing is the leaflet library itself?

如上所述，typescript 将查找传单 API 的类型定义文件，这实际上是调用传单 API 详细信息。

来自传单类型定义文件的定义 L 是一个命名空间，没有默认导出。所以你必须导入这个命名空间如下 -

import * as L from 'leaflet';

如果您要从传单中导入任何特定的 class，那么您可以使用以下语法 -

import { Circle } from 'leaflet'; //**NOTE DON'T MISS THE CURLY BRACES**

修复错误的其他选项是更改 tsconfig.json 文件中的设置

"allowSyntheticDefaultImports": true /* Allow default imports from modules with no default 
 export. This does not affect code emit, just typechecking. */

用于导入类型定义而不是主模块的 TypeScript 字符串

TypeScript tring to import type definition instead of main module

typescript

import

leaflet

definitelytyped