0

我有一个脚本可以导入很多不同的文件，如下所示：

<script type="module">
import * as A from '...';
import * as B from '...';
import * as C from '...';

我有自己的模块，我也想在其中导入和使用 A、B、C。目前我在“myfile.js”中有这个片段：

var init = (function () {
    console.log(A,B,C);
})();
export { init };

如果我在所有其他人之后添加导入：

<script type="module">
import * as A from '...';
import * as B from '...';
import * as C from '...';
import * as my from 'myfile.js';

我收到未定义 A、B、C 的错误。我如何使它工作？

编辑澄清：

A,B,C 存在于 import 语句之后，所以我可以像这样访问它们：

import * as A from ....
console.log(A);
import * as B from ...
console.log(B);

我还可以从模块内部访问全局变量，例如：

import * as A from ....
console.log(A);
import * as B from ...
console.log(B);
import * as my from 'myfile.js'

我的文件.js：

var init = (function (t) {

    console.log(t);

})(window.innerWidth);

export { init };

这将打印窗口宽度。

我正在寻找类似的功能来工作：

var init = (function (t) {

    console.log(t);

})(A);

export { init };

回调函数很像导入我的模块，然后调用一个函数并将 A 作为参数传递给它，我可以在没有回调的情况下做到这一点。

4

3 回答 3

0

您正在将它们作为组件导出，我猜是使用 {} 大括号进行初始化。如果要将它们作为组件导出，则必须在要导出的模块旁边使用 default 关键字。尝试导出默认 {init};

于 2020-10-31T11:53:19.893 回答
0

你不能。完全实现模块解析以不拉出全局范围并避免程序员问“这个变量是否存在吗？”。因此，您可以使用旧式 JavaScript，禁用模块系统。不要将“myfile”用作模块，而是将其用作全局导入：

<script src="myfile.js"></script>

如果您使用的是构建阶段，这很危险。

或者，更好的是，您可以避免对 A、B 和 C 的任何显式引用，因为此时您不知道它们是否存在。您可以使用回调：

var init = function (cb) {
    cb();
};

// use:
import {init} from ...
init(() => console.log(A,B,C));

PS。您正在混合新旧语法

于 2020-10-31T11:51:40.760 回答
0

在 JavaScript 中，作用域是由代码块、函数、模块创建的。所以模块变量不能在模块外部访问（除非使用导出显式导出）。

myFile.js如果要在其中使用它们，则应在其中导入 A、B、C 。

所以myFile.js会是：

import * as A from '...';
import * as B from '...';
import * as C from '...';

var init = (function () {
    console.log(A,B,C);
})();
export { init };

这是一些关于JavaScript 范围的有用文章

于 2020-10-31T11:58:08.170 回答