将 npm 模块与 ES6 和 npm/bundlers 的未来结合使用

Question

我使用 ES6 一段时间，对 npm 或 node.js 没有经验。

我想在我的项目中使用 ES6 来使用一些 npm 模块。

我尝试遵循并收到错误

import {axios} from './axios.js';

请求的模块“./axios.min.js”不提供名为“axios”的导出

我不想使用<script src="..."></script>标签实现。我想用 ES6 模块按需加载它。

是否有任何帮助脚本可以使 npm 模块适应 ES6 或任何解决方案？

Answer 1

import {axios} from './axios.js';

需要 Axios 有一个命名导出，例如

export function axios(...params) { ... }

不过，Axios 确实有一个默认导出，您可以在不使用花括号的情况下导入它：

import axios from './axios.js';

为了使导入在浏览器中工作，您需要使用以下命令声明导入脚本type="module"：

<script type="module" src="./js/main.js"></script>

编辑：

检查您提供的 URL 似乎 Axios 根本不提供 ECMAScript 模块。只要您使用 webpack 之类的东西来捆绑脚本，就可以按照我描述的方式导入。

我刚刚在 Axios 存储库上提交了有关该主题的问题： https: //github.com/axios/axios/issues/1879

三年后，甚至 Node.js 也支持 ES 模块，但 Axios 似乎停留在旧的代码库上，看起来不太可能更新，当您想要将 Axios 与 Vue.js 3/Vite 构建堆栈一起使用时，这会导致问题，或者苗条。

20% 的大小但并非所有功能（例如interceptors缺失）都可以在 ES6 中重写，包括正确的导出redaxios。