如何在您的 Ionic / AngularJs 应用程序中包含和使用节点模块？

Question

我有一个 Ionic 应用程序，我想包含节点模块 angular-base64 以在我的控制器中使用，或者甚至包裹在角度服务等中。我已经开始运行了

npm install angular-base64

继续并在/myIonicApp/node_modules/ 中安装了包含angular-base64.min.js 文件的文件夹。所以文件的完整路径是/myIonicApp/node_modules/angular-base64/angular-base64.min.js。

但是，当我尝试在我的一个控制器中使用该模块时：

app.controller('myController', ['$scope', '$base64',
  function($scope, $base64) {

    //$base64... 

  }
]);

它不知道我在说什么。我是否必须做其他事情才能使其正常工作？也许在我的app.js 中有什么东西？

Answer 1

接受的答案不正确。为了将客户端模块添加到您的 Ionic/AngularJS 应用程序中，您应该使用 Bower 而不是 NPM。 NPM 只能用于安装属于开发/构建/部署过程的一部分的模块。作为客户端软件包的一部分，您希望向用户展示的任何内容都应由 Bower 管理。

如果您查看.bowerrc 文件，您将看到以下内容：

{
  "directory": "www/lib"
}

此配置将 www/lib 目录设置为 bower 安装的所有内容的主目录。如果您使用以下命令，该软件包将安装在正确的位置：

bower install --save angular-base64

（--save 标志将依赖项保存在您的 bower.json 文件中。）

您现在可以将脚本标签添加到您的index.html 文件中：<script src="lib/angular-base64/angular-base64.min.js"></script>

您还需要将模块注入到您的应用中，如上所述。在app.js 中添加模块，如下所示：angular.module('starter', ['base64'])

在使用 Bower 或 NPM 等工具时，我发现必须手动修改安装通常是我做错的第一个迹象！

Answer 2

• 将目录angular-base64/angular-base64.min.js放入www/lib。

• 在index.html中包含JS文件（例如：<script src="lib/angular-base64/angular-base64.min.js"></script>。

• 在app.js:angular.module('starter', ['base64'])中注入模块。

之后，您应该可以在应用中的任何位置使用base64。

Answer 3

对于 Ionic V2，接受的答案不再准确，.bowerrc 已从默认安装中删除。

Here is how you do it now，来自官方 Ionic V2 文档。

要将第三方库添加到应用程序，请运行以下命令：

npm install --save

例如：使用导入的函数

//命名导出模式

从 'theLibraryName' 导入 { myFunction }；

...

// 使用导入的功能

myFunction();