Question

我试图用JS模块创建一个简单的页面，它将对页面做一些事情。我需要使用node.js的模块，以便我学习如何浏览作品。

我的HTML：

<!doctype html>
<html>
    <head>
        <script src="js/bundle.js" type="text/javascript"></script>
    </head>
    <body>
        <p>Hello world!</p>
    <script type="text/javascript">
        var test = require("./test.js");
        test.init();
    </script>
    </body>
</html>

这是我的JavaScript（test.js）：

"use strict";

alert("here1");

var init = function() {
    alert("here2");
}

exports.init = init

我正在制作一个包：

browserify.cmd test.js -o bundle.js

当我试图打开它显示的页面＆＃34; here1＆＃34;但是没有显示＆＃34; here2＆＃34;。在浏览器的控制台中，我看到：

Uncaught ReferenceError: require is not defined      index.html:9

如何使模块的功能（init）运行良好？

Answer 1

您需要将包含Node中所有内容的所有JavaScript代码放入test.js文件中，然后使用browserify将其转换为te bundle.js。在您的示例中，您正在使用require中的节点函数index.html，该函数不会被转换。然后浏览器会看到他不知道的函数require()，这就是隐藏问题的地方。

简单地说：您的所有javascript代码（包含节点）必须作为单个index.html包含在您的bundle.js中，这是源文件的浏览器结果。

修改

Browserify没有（默认情况下）允许您从浏览器化代码中调用任何浏览器化的功能。但是您可以通过将函数附加到window范围。
来使其可用
这是test.js（然后由 browserify 转换为bundle.js）和index.html

"use strict"; alert("here1"); window.init = function() { alert("here2"); }

<!doctype html> <html> <head> <script src="js/bundle.js" type="text/javascript"></script> </head> <body> <p>Hello world!</p> <script type="text/javascript"> init(); </script> </body> </html>

在浏览器化后无法调用模块的功能

1 个答案: