Question

今天我正在做一个项目，却遇到了这个错误。

未捕获的ReferenceError：未定义启动在HTMLInputElement.onclick（home.html：77）

我不明白我在这里做错了什么。这是index.js文件：

function launch() {
  console.log('test');
}
  

module.exports.launch = launch;

和home.html：

<script>
    let func  = require('./index');

    let launch = func.launch();

    document.getElementById('lanBTN').addEventListener('click', () => {
      launch();
    });

   <input type="button" value="Launch!" id="lanBTN" onclick="launch()">
  </script>

任何想法为什么会这样..？

Answer 1

Require是一个commonjs模块规范，除非您使用诸如webpack或browserify之类的捆绑器来解决所有模块之间的依赖关系并将一个单独的js文件捆绑为包含在html中，否则它在浏览器上不起作用

Answer 2

如@mehdi-belbal所述，如果使用Webpack之类的模块捆绑器，则无法在HTML文件中使用CommonJS。
除了那个module.exports在这里没有用，请尝试在文档的head中链接您的javascript模块。和之后的声明函数。会附加到窗口对象上，您可以使用window.func()和‍ func()

来使用它们

<head>
  <script src="./index.js"></script>
</head>
<body>
  ...
  <script>
    func();
  </script>
</body>

函数未定义

2 个答案: