如何在 Angular 控制器中使用 Browserified npm 包？答案

【问题标题】：How to use Browserified npm package in Angular controller?如何在 Angular 控制器中使用 Browserified npm 包？
【发布时间】：2016-02-25 01:20:05
【问题描述】：

我花了几个小时寻找一种方法来让这个（或任何东西）与 Browserify 一起工作，但找不到任何证明对我的问题有用的教程或示例。几乎所有这些都只展示了如何混淆您的代码，但没有一个展示如何在浏览器化后实际访问代码本身。也许这只是一件简单的事情，以至于没有人愿意提及它，所以如果这实际上是一个愚蠢的问题，我很抱歉。

所以，我有这个实现用户名和密码验证的应用程序。我将“验证器”npm 包与 OWASP 推荐的密码复杂性包结合使用来验证节点中服务器端的输入。根据我对 Browserify 项目的了解，我应该能够浏览需要这些包的模块，并将它们也加载到客户端。

我的 customValidator.js 模块现在看起来像这样：

var validator = require('validator')
var owasp = require('owasp-password-strength-test')

module.exports = {
  validator: validator,
  owasp: owasp,
  containsUsername: function(password, username) {
    return (new RegExp(username, 'i')).test(password)
  }
}

我也想在客户端使用这些功能，最好在 AngularJS 中使用，因为我使用 Angular 根据用户提供的当前（可能无效）输入来操作输入字段。

基本上我想要的是客户端和服务器端的对称输入验证，通过访问双方的相同模块，该模块已为客户端浏览器化。

我已经运行了以下命令：

browserify --standalone customValidator.js > clientSideValidator.js

然后在我的玉模板中包含 clientSideValidor.js 脚本

  script(src='clientSideValidator.js')

我尝试访问 Angular 和 jade 本身中的单独脚本中的函数，但每个函数总是返回未定义的。如何在客户端代码中运行类似 'validator.isAlphaNumeric($scope.username)' 的内容？

【问题讨论】：

我认为你需要给standalone一个名字来导出所有东西
浏览 customValidator.js --standalone myModuleName > clientSideValidator.js

标签： javascript angularjs node.js pug browserify

【解决方案1】：

你需要给 browserify 一个名字来导出所有内容。

尝试运行它并将“myModuleName”替换为您想要的名称

$ browserify customValidator.js --standalone myModuleName > clientSideValidator.js

【讨论】：

确实是这个问题，非常感谢。我看过有关独立功能的文档，但从未注意到它需要一个额外的“myModuleName”参数，可能一直在寻找它。我现在可以从 myModuleName 对象访问 Angular 中的函数。