javascript - 是否可以在 javascript 或 es6 中从 cdn 要求或导入资源
问题描述
使用 svelte 编译器从合成文件(字符串)生成代码。它的输出也是一个字符串,但它添加了来自 svelte 本身的导入语句。我需要从生成的代码中删除所有这些导入语句,但我还需要获取这些导入语句并以我可以从 CDN 导入/需要的方式添加它们。
我打算将这些导入语句解析为:
import { SvelteComponent, append, etc. } from "svelte/internal";
并将其替换为:
const { SvelteComponent, append, etc. } = svelte.internal;
我最初的想法是,如果我可以将代码内联添加到 js 模块中,以从纯 js / es6 中的 cdn 导入/需要脚本(在本例中为 svelte)。该项目是用反应编写的,我已经编写了自己的用于动态加载脚本的钩子,但我认为需要将其添加到 iframe 的窗口中。但是回想一下模块是如何工作的,我相信将脚本添加到父窗口也可以。所以我的问题是,如何将来自 cdn 的脚本导入添加到我的 javascript 模块中?
解决方案
答案取决于宿主环境。对于浏览器,答案是肯定的(假设您正在导入的资源与正在导入的资源兼容)。(相比之下,对于 Node.js,答案是否定的,至少目前是这样。)这两种环境中的模块说明符都可以是完整的 URL。请注意,通过加载import
的模块脚本受同源策略的约束,因此另一端必须为它们提供适当的 CORS 标头以允许您的站点使用它们。(CDN 通常会这样做。)
这是一个浏览器示例,导入了 Vue.js 的 JavaScript 模块版本:
<script type="module">
import {version} from "https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.5/vue.esm-browser.js";
console.log(version);
</script>
推荐阅读
- oracle - 为什么 AUTOEXTEND 不扩展 UNDOTBS1?
- html - .menu-item 不适用于 wordpress 的 css
- javascript - CSS 转换:在 Safari 中缩放非常不稳定/断断续续/生涩
- php - 回声 AFC 图像子字段
- r - dplyr:按组减去与给定条件匹配的值 - 不相等的组大小
- python - RaspberryPi 正在向 AWS IoT 发送消息 - 我无法在 aws 控制台上对其进行测试
- jquery - JQuery:$.ajax 不是函数
- python - 使用 PyPy 导入 cx_Oracle 时出现 ImportError
- azure-cognitive-search - 如何让 Azure 方面查询只返回方面
- c++ - 用 operator* 重载包装矩阵乘法