How do I make jsPDF accessible in my Ember app?

Question

I'd like to export PDF documents using jsPDF in an Ember app, but I can't figure out how to make the library available within the app.

So far, I've installed the library using bower:

bower.json

{
  "name": "myApp",
  "dependencies": {
    ...
    "jspdf": "~1.2.61"
  }
}

...and imported it in the ember-cli-build.js file:

ember-cli-build.js

...
app.import(app.bowerDirectory + '/jspdf/dist/jspdf.min.js');
...

However, when I try to use it (by calling var doc = new jsPDF() in an Ember action), I get this:

ReferenceError: jsPDF is not defined

What am I missing?

Answer 1

add your bower compoent here :

module.exports = function(defaults) {
....
  app.import(app.bowerDirectory + '/jspdf/dist/jspdf.min.js'); // Your file
....
};

Try to change your code to :

  actions:{
      createPDF: function() {

       var doc = new jsPDF(); // This part is your mistake 
       doc.text(20, 20, 'Hello world.');
       doc.save('Test.pdf');

     }
}

call your action for your button like

<button type="button" {{action "createPDF"}}>Create PDF</button>

and then Stop your Ember serve then again start it

Ember serve

that will work. when you add something to ember-cli-build.js you must stop and start your serve again .

Also for more information read this document : https://guides.emberjs.com/v2.7.0/addons-and-dependencies/managing-dependencies/