导入的Javascript函数未定义全局变量

Question

试图找出由于导入/导出方法而导致的问题，或者我的体系结构是否很糟糕。...

以前，我有多个javascript文件。只是函数，没有类。在一个“中心/主要” JS文件中，有全局变量。这些变量由同一文件以及其他文件中的函数访问和使用/更新。每个JS文件必须在index.html

中具有自己的标签。

然后此举是要切换为webpack作为模块构建器，这将消除对所有这些脚本标记的需求。相反，我只需要导入/导出函数。

---

问题在于，现在使用该方法后，全局变量未定义为导入的函数。下面是愚蠢的设置，但我不明白为什么会出现问题。也许我想念一些东西。

主JS文件

import * as SettingsFile from './settings';

var myVariableUsed;

$(document).ready(function() {
  myVariableUsed = "test";
  SettingsFile.startSettings();
});

辅助JS文件（settings.js）

export function startSettings(json) {
   console.log(myVariableUsed);
}

Answer 1

嘿，我想您可以弄清楚这篇文章正在发生什么：

https://medium.com/webpack/brief-introduction-to-scope-hoisting-in-webpack-8435084c171f

简而言之，由于对生成的代码输出进行了“严格使用”声明，因此webpack为所需文件创建了新作用域。

要将参数传递给必需的模块，您需要执行以下操作：

// somefile
require("lib.js")(param1, param2)
// lib.js
module.exports = function(param1, param2) { }