浏览库而不是文件答案

【问题标题】：Browserify a library rather than a file浏览库而不是文件
【发布时间】：2017-02-12 20:20:09
【问题描述】：

我正在尝试在浏览器中使用 npm 库。以npm库uniq为例，目前我们需要先在本地编写使用uniq的代码：

// main.js
var unique = require('uniq');    
var data = [1, 2, 2, 3, 4, 5, 5, 5, 6];
console.log(unique(data));

然后，我们需要在控制台中运行browserify：

browserify main.js -o bundle.js

现在，我们可以在 html 文件中使用它：

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

我的问题是，是否可以浏览一个库，以便“脚本”标签内的任何代码都可以使用它。例如，在 html 部分，我可能想写

<html>
  <head>
    <script src="the_browserified_library.js"></script>
  </head>
  <body>
    <script>
       <!-- the following code may change -->
       var d = [1, 1, 2, 3];
       console.log(unique(d));
       var a = [2, 2, 4, 5];
       console.log(unique(a));
    </script>
  </body>
</html>

如果可能，我们将不必在每次更改代码后浏览（在控制台中）代码。

有谁知道是否可以通过 browserify 或任何其他工具实现？

编辑1：按照@dNitro的回答，我全局安装了globalify，但后来报错：

/tmp/client$ globalify uniq -o uniq.js
/usr/local/lib/node_modules/globalify/node_modules/camelcase/index.js:4
    let isLastCharLower = false;
    ^^^
SyntaxError: Unexpected strict mode reserved word
    at exports.runInThisContext (vm.js:73:16)
    at Module._compile (module.js:443:25)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/usr/local/lib/node_modules/globalify/globalify.js:7:17)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)

【问题讨论】：

标签： node.js npm browserify

【解决方案1】：

所以你想让 npm 包的 global 变量？！使用globalify:

安装：

npm install globalify -g

用法：

globalify uniq -o uniq.js

然后在你的 html 中：

<script src="uniq.js"></script>    
<script>
  var d = [1, 1, 2, 3];
  console.log(uniq(d));
</script>

注意，您应该避免污染全局范围。以这种方式编写代码是有害的。 browserify 不仅使您的代码浏览器准备就绪，它还帮助您编写干净（不会污染全局窗口范围）、模块化（CommonJS 或 ES6 方式）和未来证明（编写 ES6 并在捆绑时对其进行转换）并且您的应用程序已准备就绪对 bundle.js 文件只有一个 http 请求。

如果每次更改代码都运行 browserify 让您感到困扰，您可以考虑使用 watchify;它会在您对文件进行的每一次更改时自动重建捆绑包。

【讨论】：

谢谢...请查看我的更新。另外，我们一开始还需要在控制台中使用globalify。有没有办法自动将任何（或大部分）npm node.js 库浏览器兼容？我看不到如何在服务器或浏览器中自动执行此 globalify 命令（依赖于控制台）...
@SoftTimur，您的节点似乎不支持 ES2015 语法，请检查您的节点版本：node -v。如果您的节点版本低于v5.0.0，您应该升级。 globalify 除了cmdline 还有一个API。你可以要求它并运行globalify() 来完成它的工作。只需将您想要的包的数组循环遍历它们并一个接一个地给globalify()，然后将它们写入磁盘。见：API example