从 HTML 文件中的脚本标签导入 js。可能的？

Question

我想从 cms 生成的 html 文件中的脚本标记访问数据。是否可以在不污染全局名称空间的情况下执行此操作？我曾尝试使用 es6 模块，但我失败了，而且我找不到任何关于它的信息。

     <script>
        let list = ['a','b','c'];
        export default list
    </script>

     //test.js
    import list from './index.html'

错误：’ http://localhost:8080/index.html net::ERR_ABORTED 404’ 或：’无法加载模块脚本：服务器以非 JavaScript MIME 类型“text/html”响应。根据 HTML 规范对模块脚本执行严格的 MIME 类型检查。

原文由 GrzMaz 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

不，这样做还没有包含在 HTML 规范中¹（而且我怀疑它永远不会是²）。 （如果是，您仍然需要 type="module" 在您的第一个脚本标记上。）在 HTML 页面中没有指定脚本元素的 _模块说明符_。目前，唯一的模块说明符是 JavaScript 文件的 URL。 规范中的详细信息。

相反，您可能想要这样的东西：

 <script type="module">
import { setList } from "./test.js";
setList(['a', 'b', 'c']);
</script>

…其中 test.js 导出一个命名导出，让您告诉它要使用的列表。

（或者当然，它可以是默认导出。）

内联 script type="module" 标签可以 import ，但是虽然它们可以使用 export ，但没有任何东西可以使用它们创建的没有有用模块说明符的导出。

---

¹ 这是 HTML 规范，因为 模块说明符 的形式和语义由 JavaScript 规范留给宿主环境（详情请参见 此处）。 JavaScript 规范对它们的所有描述都是它们是字符串文字。

² 当然 _可以_，例如使用片段标识符。但是，与 HTTP/1.1 相比（尤其是与 HTTP/1.0 相比），由于 HTTP/2 多路复用使得离散资源加载速度如此之快，因此现在将所有内容都包含在单个资源中的动力比几年前要低得多。

原文由 T.J. Crowder 发布，翻译遵循 CC BY-SA 4.0 许可协议