使用导入的Javascript函数ES6访问主文件中的全局变量

我使用的是

Vue.js

，但只使用

js

文件，而不是

Vue

文件，我正在将一个组件导入我的主

app.js

中，如下所示：

import autoPosts from './components/autoPosts.js';

它导入的很好，但我正在尝试访问这些全局。在人们因为使用全局变量而毁掉我之前，你能告诉我这是否可行吗

const apiRoot    = location.origin + '/wp-json/wp/v2/';
const acfApiRoot = location.origin + '/wp-json/acf/v3/';

import autoPosts from './components/autoPosts.js';

它不会在该组件中读取

apiRoot

或

acfApiRoot

，无论我在变量之前或之后包含它

它工作的唯一方法是，如果我在我的组件文件

autoPosts.js

中声明变量，那么它不能使用窗口吗

window.apiRoot = location.origin + '/wp-json/wp/v2/';

只是使用

const apiRoot = 'whatever';

不会使其成为全局变量，并且由于未导出而不可访问

要使用全局变量，请将其添加到窗口

window.apiRoot = 'whatever';

并且它可以从任何具有简单变量名的其他类访问

console.log(apiRoot); // outputs 'whatever'

---

仅仅因为

app.js

是主模块并不意味着其中声明的变量是全局变量。但无论如何，您不应该使用全局变量。相反，创建另一个模块

// config.js
export const apiRoot    = location.origin + '/wp-json/wp/v2/';
export const acfApiRoot = location.origin + '/wp-json/acf/v3/';

您可以在需要常量的地方导入：

// components/autoPosts.js
import { apiRoot, acfApiRoot } from '/config.js';
…

---

您希望

autoPosts

读取变量

apiRoot

？是，我试图让autoPosts读取主文件中的变量，只是因为

app.js

是主模块，并不意味着其中声明的变量是全局变量。我认为它们是可以访问的，但我很清楚wrong@NateBeers只有在加载模块后访问变量时，在执行

autoPosts

module的过程中，这正是我应该做的。我不知道这可以做到。需要复习一下更新的javascript，我肯定会在这里使用通配符导入器（

import*as config from./config.js'

）。然后您可以将变量引用为

config.apiRoot

，这更容易理解：）@FabianvonEllerts当然，哪种导入样式更简单是一种主观选择。@Bergi您知道导入文件中的代码是否会在每次导入时重新计算吗？我正在寻找一种方法，只运行一次基本函数（如“isMobile”），以后只引用它们。或者可能函数被缓存了，性能的提高不值得…@FabianvonEllerts每个模块只被实例化和评估一次。