import如何引入非es模块的文件？

Question

import如何引入非es模块的文件？

我把node_modules的中js库pageage.json中main指向的文件拿出来调，
import ukit from './ukit';
一开始会报does not provide an export named 'default'
换了一种方式

import * as ukit from './ukit';
console.log(ukit);

输出为什么会返回这种格式，我需要怎么调用？

前端 javascript vite

阅读 74

AI BotBETA

### 回答

在 Node.js 环境中，如果你尝试使用 ES 模块 (`import`/`export`) 语法来引入一个非 ES 模块（例如 CommonJS 模块），你可能会遇到一些问题。这是因为 CommonJS 和 ES 模块有不同的模块导出和导入机制。

1. **关于 `import ukit from './ukit';` 报错**：
   - 这个错误提示“does not provide an export named 'default'”表明你尝试从 `./ukit` 导入一个默认导出（`default export`），但是该文件实际上并没有提供一个默认导出。
   - CommonJS 模块默认导出的是 `module.exports` 对象，而不是一个单独的 `default` 导出。因此，当你尝试用 `import ukit from './ukit';` 导入时，ES 模块系统会寻找一个名为 `default` 的导出，但找不到，所以报错。

2. **关于 `import * as ukit from './ukit';` 的输出**：
   - 使用 `import * as ukit from './ukit';` 会将 `./ukit` 模块中导出的所有内容（无论是默认导出还是命名导出）作为属性放在一个名为 `ukit` 的对象中。
   - 如果你查看 `console.log(ukit);` 的输出，你会看到一个对象，其中包含模块中导出的所有内容。这是因为 CommonJS 模块通常会导出多个属性或方法，而不是单一的默认导出。

3. **如何调用**：
   - 既然你已经使用 `import * as ukit from './ukit';` 导入了所有内容，你可以通过 `ukit` 对象来访问这些导出的内容。
   - 例如，如果 `./ukit` 模块中导出了一个名为 `Button` 的组件，你可以通过 `ukit.Button` 来访问它。

4. **解决方案**：
   - 如果你控制 `./ukit` 模块，可以将其转换为 ES 模块，并明确使用 `export default` 或 `export const/let/function` 来导出内容。
   - 如果你不能修改 `./ukit` 模块，你可能需要继续使用 CommonJS 的 `require` 语法来导入它，或者在项目中配置 Babel 等工具来转换模块系统。

希望这能帮助你解决问题！

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

import如何引入非es模块的文件？

你尚未登录，登录后可以

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

两个promise问题？

网站的不同域名互相跳转如何保持登录态？

Vue项目一个报错无法找到原因?

如何在JavaScript中从外部中断for循环的执行？

Quartz如何根据cron表达式计算任务开始前发送通知的时间？