onsubmit 函数找不到 webpack 捆绑的函数答案

【问题标题】：onsubmit function fails to find function bundled by webpackonsubmit 函数找不到 webpack 捆绑的函数
【发布时间】：2016-10-02 10:47:17
【问题描述】：

我一定遗漏了 Webpack 或 JS 的一些非常基本的东西。我只想在表单的提交函数中调用捆绑函数。我收到一个未找到函数的消息，但我不知道为什么。

错误 index.html:13 Uncaught ReferenceError: double is not defined

index.html（为简洁起见删除了结束标签）

<head>
    <script type="text/javascript" src="bundle.js"></script>
<body>
    <form name='myform' onsubmit="doStuff(event); return false;">
        <button type="submit">Press Me!</button>
    <script type="text/javascript">
        function doStuff(e) {
            e.preventDefault();
            console.log(double(32));
        }

abc.js（webpack 入口点）

var a = require('./double');

double.js

function double(number) {
    return number * 2;
}
module.exports.double = double;

捆绑...

$ webpack abc.js bundle.js 
Hash: 0e65404017702c54dac5
Version: webpack 1.13.2
Time: 59ms
    Asset      Size  Chunks             Chunk Names
    bundle.js  1.58 kB       0  [emitted]  main
    [0] ./abc.js 28 bytes {0} [built]
    [1] ./double.js 80 bytes {0} [built]

任何帮助表示赞赏

【问题讨论】：

标签： javascript html web webpack

【解决方案1】：

问题是试图混合页面和捆绑的 JS。它们在不同的范围内，因此捆绑的方法不可见。

我将 onsubmit 函数从页面移动到入口文件，在 window.load 之后运行。 window 对象当然是全局的，因此捆绑的代码可以将事件处理程序添加到任何 DOM 元素。

【讨论】：