ES6 import 相当于 require() 没有导出

Posted 2023-02-24

【中文标题】ES6 import 相当于 require() 没有导出

【英文标题】：ES6 import equivalent of require() without exports

【发布时间】：2017-05-01 23:32:11

【问题描述】：

通过使用require(./filename)，我可以在 filename 中包含并执行代码，而无需在 filename 本身中定义任何导出。

在 ES6 中使用 import 的等价物是什么？

谢谢

【参考方案1】：

等价的很简单：

import "./filename";

以下是一些可能的语法变化：

import defaultMember from "module-name";  

import * as name from "module-name";  

import  member  from "module-name";  

import  member as alias  from "module-name";  

import  member1 , member2  from "module-name";  

import  member1 , member2 as alias2 , [...]  from "module-name";  

import defaultMember,  member [ , [...] ]  from "module-name";  

import defaultMember, * as name from "module-name";  

import "module-name";

来源： MDN

【讨论】：

根据您在答案中引用的same page，这实际上似乎是不正确的。这种导入将执行代码，但不会保留对已定义变量的任何引用（我也在我的项目中确认了这种行为）。

例如，如果我有一个名为code.js 的文件，其中我有const foo = 1; console.log(foo);，并且我在main.js 中说import "code.js"，我将无法访问foo 在main.js 中.但是，1 将打印到控制台，因为code.js 中的代码将执行。如果这有点难以理解，这里有一个 StackBlitz 来展示我在做什么。

@brandaemon 这正是 NodeJS 和 require 的工作原理。并不是它不保留引用，而是这些变量是块作用域，所以你不能在调用模块中访问它们。如果您将 foo 放在窗口（浏览器）或全局（节点）上，这将按照您的预期进行

啊，好吧。所以没有明确的exports 就没有办法包含范围引用？我正在考虑当 html 文件中有多个脚本标签时会出现的行为。

@brandaemon 没有，没有。不过，我可以看到您认为它会以同样的方式工作！