Integrating d3 charts or Vendor libraries into a base ionic project

I’m fairly new to using command line utilities like grunt, bower, and npm but am finding my way around now. Having created a number of different projects using yo, angular-generate, and ionic I’m also getting to grips with what each does in terms of automation, particularly build automation.

All the above said, I have build a simple app using the side menu template provided out of the box. I am now trying to integrate d3 charts into it. Following some of my own research, and the latest ng-newsletter from the guys over at AngularJS I settled on using https://github.com/cmaurer/angularjs-nvd3-directives which looks to fit the bill.

The d3 guide shows how to include the required files via bower, I have done this, and hey presto the bower_components directory has what is needed to do the job. my question here is as follows:

Given that the ionic framework runs and is edited directly from the www folder rather than being written from one directory and being compiled using something like grunt into the www folder to be served, thus compiling and minifying all bower components. Whats is the best way of integration 3rd party or vendor js libraries like d3 charts - is it to simply put the .js files into the ionic www\lib… directory or is it to integrate a build automation tool like grunt (allowing the compilation of the bower components into a vendor.js file) into the project - any advice or pointers to good articles is appreciated here.

I’d rather do things the clean and right way from the start than fumble my way to the right answer.

Many thanks in advance,

John

1 Like