Question

我对模块化JS完全不熟悉，之前从未使用任何模式。我正在编写一个项目，其中包含多达400多行代码，我希望通过分离不同模块中的内容来更好地管理它。我选择使用commonJS模块，因为我已经使用了webpack。现在我将我的第一个函数放在一个不同的模块中，并将其导出为：

//init.js file
var initt = function () {
  octaveNumber = document.getElementById("octaveNum");
  audioCtx = new (window.AudioContext || window.webkitAudioContext);
  osc = audioCtx.createOscillator();
  volume = audioCtx.createGain();
  filter = audioCtx.createBiquadFilter();
  osc.connect(filter);
  volume.connect(audioCtx.destination);
  booleanVal = false;
  osc.frequency.value = dial.value
  osc.start();
  gainDisplay.innerHTML = gainSlider.value;
  noteSetOscFreq()
  octaveUpClick()
  octaveDownClick()
  waveFormSelector()
}

module.exports = initt;

在我的主JS文件中我需要它

var messages = require('./init');

最后在它所属的If语句中调用该函数：

if (!localStorage.getItem("presetsArr") {
  messages.initt;

不幸的是，我在控制台中得到Cannot read property 'gain' of undefined，这意味着Init模块没有按照预期初始化变量和其他内容。当我在没有使用commonJS模块的情况下将整个功能放回去时，它工作得很好。我知道它可能是回归价值的东西，但我不能把它放在它上面。没有什么工作。

Answer 1

messages.initt（）X

消息（）√

CommonJS模块在调用时返回undefined

1 个答案: