Damon
Damon

Reputation: 4514

Angular: How can I use Velocity.js within my Angular application?

I have used velocity.js in my own personal web sites but never within an angular application. I'm not an angular developer (yet) so please bear with me.

I am following the README file on the angular-velocity github page. But when I run my application, I am getting an error that I am missing the module.

Here is what my module declaration looks like:

var appModule = angular.module('app.module', ['module-one', 'module-two', 'angular-velocity']);

...

The error I get now is:

Module 'angular-velocity' is not available! You either misspelled the module name or forgot to load it.

Further reading I see this:

When installing from npm, it is assumed that VelocityJS will be installed and loaded before Angular Velocity.

Ok, so I installed (via npm) the velocity library. How do I include that in my list of dependancies?

Also this:

angular-velocity assumes that the Angular core and the additional ngAnimate module is loaded

So does that mean I need something like this?

var appModule = angular.module('app.module', ['module-one', 'module-two', 'ngAnimate', 'angular-velocity']);

But in the example, all that is listed is angular-velocity.

Nowhere in my project do I see individual script tags. I am assuming the project just reads the dependancies and grabs them from the package.json file? (Completely guessing).

This does not happen:

<script src="bower_components/velocity/velocity.min.js"></script>
<script src="bower_components/velocity/velocity.ui.min.js"></script
<script src="bower_components/angular-velocity/angular-velocity.min.js"></script>

Thank you for any suggestions!

Upvotes: 4

Views: 1258

Answers (1)

GibboK
GibboK

Reputation: 73928

You can include velocity using CDN

<script src="//cdnjs.cloudflare.com/ajax/libs/velocity/1.2.3/velocity.min.js"></script>
<script src="//cdn.jsdelivr.net/velocity/1.2.3/velocity.min.js"></script>

or using bower

bower install velocity

and add its references in the header from default folder bower_components.

If instead you use npm you can use:

npm install velocity-animate

and add its references in the header from default folder node_modules.

Upvotes: 2

Related Questions