How to include and use node modules in your Ionic / AngularJs app?

Question

The accepted answer is not correct. In order to add client-side modules to your Ionic/AngularJS app, you should use Bower and not NPM. NPM should only be used to install modules that are part of the development/build/deployment processes. Anything you want to come across to your users as part of the client-side package should be managed by Bower.

If you look in the .bowerrc file, you'll see the following:

{
  "directory": "www/lib"
}

This configuration sets the www/lib directory as the home for everything installed by bower. If you use the following command, the package will be installed in the correct location:

bower install --save angular-base64

(The --save flag saves the dependency in your bower.json file.)

You may now add the script tag to your index.html file: <script src="lib/angular-base64/angular-base64.min.js"></script>

You will also need to inject the module into your app as described above. In app.js add the module like so: angular.module('starter', ['base64'])

When using tools like Bower or NPM, I find that having to make manual modifications to an installation is often the first sign that I've done it wrong!

• Place the directory angular-base64/angular-base64.min.js in www/lib.

• Include the JS file in index.html (for example: <script src="lib/angular-base64/angular-base64.min.js"></script>.

• Inject the module in app.js: angular.module('starter', ['base64']).

Afterwards you should be able to use base64 everywhere in your app.

The accepted answer is no longer accurate for Ionic V2 and the .bowerrc was removed from default installation.

Here is how you do it now, from the official Ionic V2 docs.

To add a third party library to an app, run the following command:

npm install --save

eg: Using the imported function

// named export pattern

import { myFunction } from 'theLibraryName';

...

// use the imported functionality

myFunction();