Browserify不起作用 - 为什么？

Question

我有以下代码，我浏览到bundle.js，我在前端包含（在加载任何其他.js文件之前）。我浏览的文件就是这样：

var firebase = require('firebase')

然后我在这个变量上调用authorize（），在前端包含的下一个文件中，但是我得到一个错误，说明没有定义firebase？

Answer 1

Browserify 是一个模块捆绑包，可让您在浏览器中使用 CommonJS （节点）模块。这意味着您的项目必须遵循 CommonJS 约定来导出（exports，module.exports）和导入（require）模块。这是一个基本的例子：

您的模块（ module.js ）

var foo = function () {
  console.log('Foo');
};

var bar = function () {
  console.log('Bar');
};

module.exports = {
  foo: foo,
  bar: bar
};

您的入口点（ main.js ）

var module = require('./module');

module.foo(); // Foo
module.bar(); // Bar

此代码将与Node一起开箱即用，但您的浏览器无法解释它。这是Browserify很有用的地方......

当您在入口点上运行命令browserify main.js -o bundle.js时，Browserify将遍历所有依赖项（此处为module.js）并将其加载到一个包中。此捆绑包可在您的浏览器中使用，因此您现在可以将其加载到脚本标记中：

<script src="bundle.js"></script>