gpt4 book ai didi

javascript - 如何使用 ES 模块通过 URL 导入?

转载 作者:行者123 更新时间:2023-12-03 08:18:07 26 4
gpt4 key购买 nike

我想直接从 URL 导入像 axios 这样的库并使用它。

我不想将其添加为将 axios 添加到 window 对象的脚本(如下所示)。

index.html
<body>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="./app.js" type="module"></script>
</body>
app.js
console.log(window.axios !== undefined); // true
const { data } = await axios.get(
"https://jsonplaceholder.typicode.com/users/1"
);
console.log(data.username); // Bret

我想要这样的东西,其中我可以直接从 URL 导入 axios

index.html
<body>
<script src="./app.js" type="module"></script>
</body>
app.js
import axios from "https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js";

console.log(window.axios !== undefined);
const { data } = await axios.get(
"https://jsonplaceholder.typicode.com/users/1"
);
console.log(data.username);

显然这不起作用,因为上述 CDN 提供的 JavaScript 代码并不适合与 ES 模块一起使用。有解决办法吗?

最佳答案

您可以使用 Skypack:

import axios from 'https://cdn.skypack.dev/axios';

const { data } = await axios.get(
"https://jsonplaceholder.typicode.com/users/1"
);
console.log(data.username);

删除 jsDelivr CDN 链接。

关于javascript - 如何使用 ES 模块通过 URL 导入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68693509/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com