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);

输出为什么会返回这种格式,我需要怎么调用?
image.png

阅读 265
avatarAI 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 等工具来转换模块系统。

希望这能帮助你解决问题!
1 个回答

使用 import * as ukit from './ukit'; 时,ukit 就成为了一个包含所有导出的对象。

导入所有导出的对象

import * as ukit from './ukit';

// 假设 ukit 模块中有一个名为 initialize 的函数,可以这样访问
ukit.initialize();

// 假设 ukit 模块中有一个名为 version 的变量,可以这样访问
console.log(ukit.version);

导入默认导出

如果希望导入默认导出(即 export default),可以这样做:

import ukit from './ukit';

// 现在你可以直接使用默认导出的内容
ukit.someFunction();

确保模块中有默认导出

确保 ukit 模块中确实有默认导出:

// ukit.js
export default {
  someFunction() {
    console.log('This is a default export function');
  }
};
推荐问题
宣传栏