Typescript、index.d.ts 和 webpack:找不到模块错误

Posted

技术标签:

【中文标题】Typescript、index.d.ts 和 webpack:找不到模块错误【英文标题】:Typescript, index.d.ts and webpack: Module not found error 【发布时间】:2016-11-10 03:04:43 【问题描述】:

我使用 webpack 创建了 Typescript 项目,遵循 this tutorial。 因为我有很多模块,所以我将 index.d.ts 添加到了我的 src/components 文件夹中,我导出了所有模块:

export Module1 from "./Module1";
export Module2 from "./Module2";
export Module3 from "./Module3";

我将 index.d.ts 添加到 tsconfig.json 文件中:

"files": [
    "./src/components/index.d.ts"
]

然后,在 src 文件夹中的 index.tsx 中,我导入:

import * as MyModule from "./components/";

代码提示工作正常,所以我想所有路径都可以。 但是当我运行 webpack 时,我得到了这个错误:

找不到模块:错误:无法解析目录“./components”

据我了解,webpack 没有找到这个 index.d.ts 文件。我尝试将 d.ts 添加到 webpack.config.js 扩展中,例如 described here,但随后我收到了不同的错误消息。我错过了什么吗?

【问题讨论】:

【参考方案1】:

想出了一个解决方案,将 index.ts 用于所有导出,而不是 index.d.ts。

【讨论】:

【参考方案2】:

对我来说,我最终将其从 './types' 更改为 './types.d'

所以类型导入看起来像,

import 
    TSomeType,
    ISomeInterface,
    ESomeEnum
 from 'src/types/components/SomeComponent/types.d'

而不是,

import 
    TSomeType,
    ISomeInterface,
    ESomeEnum
 from 'src/types/components/SomeComponent/types'

取自this评论:

我可以确认这个问题,@Draccoz @filipesilva。

将文件名从 .d.ts 更改为 .ts 时不会发生这种情况。 当您从 import Something from 'yourlib' 更改您的导入时,它也不会发生;从'yourlib.d'导入Something;

我刚刚将一个工作项目从 webpack-starter 种子(TypeScript/Angular)移动到 CLI 并收到此错误,因此我认为它与生成的 CLI 项目有关。

我正在使用@angular/cli: 1.0.0-rc.2


我认为还值得一提的是 tsx 文件可以正常工作。我必须将 types 更改为 types.d 仅用于 ts 文件。

【讨论】:

以上是关于Typescript、index.d.ts 和 webpack:找不到模块错误的主要内容,如果未能解决你的问题,请参考以下文章

TypeScript 打字给我“index.d.ts 不是模块”

从 typescript 模块自动生成 index.d.ts,类型定义

Bootstrap4 打字(index.d.ts)无法在 VisualStudio 2019 上使用 TypeScript3.9 和 Libman 找到模块“popper.js”

Typescript 生成带有 `#private;` 字段的声明 d.ts 文件

在 Visual Studio 代码中,如何跳转到 typescript 类型定义 index.d.ts 中的实际代码?

获取TypeScript的声明文件.d.ts