I have an Ionic app and I'd like to include the node module angular-base64 to use in my controllers, or even wrap inside an angular service etc. I've gone ahead and ran
npm install angular-base64
Which went ahead and installed the folder containing angular-base64.min.js
file inside /myIonicApp/node_modules/
. So the full path to the file is /myIonicApp/node_modules/angular-base64/angular-base64.min.js
.
However when I try and make use of the module in one of my controllers like this:
app.controller('myController', ['$scope', '$base64',
function($scope, $base64) {
//$base64...
}
]);
It has no idea what I'm talking about. Do I have to do something else to get this to work? Perhaps something in my app.js
?
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();
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.