迹忆客 专注技术分享

当我们尝试导入指定模块中不存在的成员时，会出现错误“Module has no exported member”。 要解决该错误，需要确保模块导出特定成员并且您没有输入错误的名称或将名称错误命名为默认导入。

下面是一个产生上述错误的示例代码。 这是一个名为 another-file.ts 的文件

another-file.ts

export function sum(a: number, b: number) {
  return a + b;
}

这是一个名为 index.ts 的文件

index.ts

// ⛔️ Error: Module '"./another-file"' has no
// exported member 'multiply'.ts(2305)
import { multiply } from './another-file';

console.log(multiply(15, 15));

请注意 ，another-file.ts 不会导出名为 multiply 的函数，因此当我们尝试从模块中导入不存在的成员时，会出现错误。

如果我们从第三方库导入，请确保它导出特定成员并且我们没有输入错误的名称。

如果成员是使用命名导出导出的，则必须将导入用大括号括起来。

another-file.ts

// 👇️ named export
export function sum(a: number, b: number) {
  return a + b;
}

const num = 350;

// 👇️ default export
export default num;

我们将导入默认值和命名导出为：

index.ts

// 👇️ default and named imports
import num, { sum } from './another-file';

console.log(sum(num, num)); // 👉️ 700

请注意 ，我们在导入默认导出时没有将其包裹在花括号中。

如果从本地文件导入时出现错误，请确保指定的模块路径正确。

例如，如果我们从一个目录向上导入，我们可以 import {myFunction} from '../myFile'。

我们可能已尝试从另一个文件（不导出它的文件）导入特定成员。

根据我的经验，最好使用我们的 IDE 进行自动完成以避免出现“Module has no exported member”错误。

如果我们首先写入模块的路径并放置大括号，在 VSCode（以及大多数其他编辑器）中，可以按 ctrl + 空格 并获得模块命名导出的自动完成。

import { CTRL + Space here } from './another-file';

如果您从本地文件导入，您还可以利用 IDE 自动完成路径。

总结

当我们尝试导入指定模块中不存在的成员时，会出现错误“模块没有导出的成员”。 要解决该错误，需要确保模块导出特定成员并且您没有输入错误的名称或将名称错误命名为默认导入。