模块在使用browserify捆绑时显示在控制台中未定义

Question

在我把我的项目转移到它之前，我是第一次浏览和尝试理解它。

我浏览了这些文档并了解了如何使用它，我试图包含一些更多的依赖项，但是在使用时，它们被声明为没有定义！

这是我的档案：

main.js

window.jQuery = $ = require("jquery");
require('bootstrap');
require("jquery-confirm");
require("html2canvas");

package.json

{
  "dependencies": {
    "bootstrap": "^3.3.7",
    "html2canvas": "^0.5.0-beta4",
    "jquery": "^3.2.1",
    "jquery-confirm": "^3.3.2",
    "jshint": "^2.9.5",
    "qrcodejs": "^1.0.0"
  }
}

当我试图通过浏览器控制台访问这些文件时，Html2canvas、jshint和qrcode都是未定义的，但是jquery-确认似乎运行良好。

告诉我我在这件事上哪里错了。

-Thanks

Answer 1

那是因为你把它们作为模块加载。能够使用诸如Browserify这样的捆绑系统的全部意义在于，您不必有全局变量。

如果您检查其中一个返回调用的返回值，您将看到。

示例：

var html2canvas= require('html2canvas');
console.log(html2canvas);

如果您想使它们成为全局的(并且您确实应该警告不要这样做)，那么您可以将它们附加到window对象。

window.html2canvas = require('html2canvas');

但我完全想建议，除非你必须这样做，否则你不会让事情变得全球化。例如，只需在开始时执行以下操作，就可以在任何文件中使用jQuery：

var $ = require('jquery');