我的webpack档案怎么了？

Question

好吧，假设在main.js上，我有这样的：

var topMenu = require('./menu.js');
console.log(topMenu.getCount()); // 1
topMenu.increment();
console.log(topMenu.getCount()); // 2

在menu.js上，我有一个：

exports.currentTab = 0;

var count = 1;
exports.increment = function() { count++; };
exports.getCount = function() { return count; };

exports.showSearch = function () {
    $(".about-box").removeClass("active");
    $(".tele-box").removeClass("active");
    $(".tuts-box").addClass("active");

    $(".search-div").toggle();

    if (!$(".search-div").is(":visible")) {
        $(".tuts-box").removeClass("active");
    }

    currentTab = 1;
}

module.exports = [
exports.onKeyPressing = document.onkeypress = function(evt) {
if (evt.keyCode == 49) {
    console.log("Open 1st box");
        showTeles();
    }
if (evt.keyCode == 50) {
    console.log("Open 2nd box");
        showSearch();
    }
if (evt.keyCode == 51) {
    console.log("Open 3rd box");
        showAbout();
    }
}

];

我的bundle.js编译正确。我确实知道。然而，打开访问页面，我得到Uncaught TypeError: undefined is not a function在线console.log(topMenu.getCount()); // 1 in main.js (bundle.js，因为它编译正确.)

但是，当我移除这个和里面的内容时：

module.exports = [
    ...
];

这是在menu.js底部附近找到的，然后它就工作了，我得到：

1
2

如预期的那样。我的文件有什么问题，如何修复？而且，我可能对exports.showSearch()的定义是错误的。总之，您能找到我在创建这个文件时所犯的错误吗？谢谢。

Answer 1

exports是module.exports的别名。因此，当您在本部分中将数组分配给module.exports时：

module.exports = [
    ...
];

您正在重写(清除) module.exports和exports中的值。因此，所有这些作业都丢失了：

exports.currentTab = 0;

exports.increment = function() { count++; };
exports.getCount = function() { return count; };

exports.showSearch = function () {
  // ...
}

这就是你得到Uncaught TypeError: undefined is not a function的原因。没有像getCount()这样的函数附加到exports (和topMenu)。

更新

我不知道您想要实现什么，但是将分配给module.exports 的任务移除可能会解决的问题：

exports.onKeyPressing = document.onkeypress = function(evt) {
  // ...
}

再说一次，这取决于你想要实现什么。