How to include javascript third party library in ionic app?

1

Hello,
I am trying to use JSSOR ( http://www.jssor.com/ ) and JQUERY libraries in ionic but it’s not working with partials files except with index.html root file only.
How to include javascript third party library in ionic app ?

2

Are you using bower? If not, I would highly recommend it. Basically with bower, you can install any 3rd party package (library) and include that in your project. Odds are you have a bower.json file and thats how you are including ionic and angular.

When you find a library you want to use, you just run

bower install "YOUR CHOSEN LIBRARY" --save

What this will do is download that library/package and place it in a bower_components folder and include a reference in your bower.json file.

Then make sure you are referencing the correct js and css files for that library within your index.html file.

If you don’t want to use bower, or you can’t find a specific bower package (which happens a lot), what I do is I have a 3rd party libs folder in my project, and I will create a new folder within this 3rd party libs folder, and name it after that library I need. Then I copy in the js and css files, and include a reference to them in my index.html file.

It would look something like this:

 app (folder)
   libs (folder)
       JSSOR (folder)
          jssor.js (file)
          jssor.css (file)

then in my index.html, I would also include these (formatting is off due to forum editor)

link href="libs/JSSOR/jssor.css" rel="stylesheet"
script src="libs/JSSOR/jssor.js"/script
1 Like
3

if you are using bower --> put a http://bower.io/docs/creating-packages/#bowerjson in your project so you can easy manage your dependencies.

4

Ok i added my third party library with " ionic add jssor " and " ionic add jquery " after finding their component namespaces with " bower search " and after adding in header
"script src=“lib/jquery/dist/jquery.min.js”>
"script src=“lib/jssor-slider/js/jssor.slider.mini.js”>

But it’s only working in the root page www/index.html.
How can i insert javascript codes from third party libraries in partials templates files with tags like ion-view>ion-content> ?

5

Ok to make it all work , i had to use it in js Controller file from angular architecture.
But is there another alternative ?

6

How can i insert javascript codes from third party libraries in partials templates files? Do you have an answer now? I am interesting in too.

7

If anybody is still reading this, I strongly disagree with the bower recommendation. npm is much better.

8

It is, but not with ionic 1 imo. It’s build around gulp & bower.