jsPDF: ES6 import doesn't work in versions 1.5.1 and 1.5.2

I’m trying to import jspdf into my Vuejs application. But looks like it imports function RGBColor instead of the the module.

Are you using the latest version of jsPDF? Yes

Have you tried using jspdf.debug.js? Yes

Steps to reproduce

import jsPDF from 'jspdf/dist/jspdf.debug';
console.log(jsPDF);

or

import * as jsPDF from 'jspdf/dist/jspdf.debug';
console.log(jsPDF);

What I saw Output in versions 1.5.1 and 1.5.2:

RGBColor()
​  length: 1
​  name: "RGBColor"
  ​prototype: Object { … }
​  __proto__: function ()

What I expected Output in 1.4.1:

jsPDF()
  ​API: Object { events: (13) […], addField: addField(), addButton: addButton(), … }
​  length: 4
​  name: "jsPDF"
​  prototype: Object { … }
​  saveAs: function saveAs()
​  version: "0.0.0"
​  __proto__: function ()

Is something wrong with my setup?

My env:

$ vue info

Environment Info:

  System:
    OS: Windows 7
    CPU: (4) x64 Intel(R) Core(TM) i5-6300U CPU @ 2.40GHz
  Binaries:
    Node: 8.11.3 - C:\Programs\Devel\node\node.EXE
    Yarn: Not Found
    npm: 6.5.0 - C:\Programs\Devel\node\npm.CMD
  npmPackages:
    @vue/babel-preset-app:  3.2.0
    @vue/cli-overlay:  3.2.0
    @vue/cli-plugin-babel: ^3.2.0 => 3.2.0
    @vue/cli-plugin-eslint: ^3.2.0 => 3.2.1
    @vue/cli-service: ^3.2.0 => 3.2.0
    @vue/cli-shared-utils:  3.2.0
    @vue/component-compiler-utils:  2.3.1
    @vue/eslint-config-airbnb: ^4.0.0 => 4.0.0
    @vue/preload-webpack-plugin:  1.1.0
    @vue/web-component-wrapper:  1.2.0
    babel-helper-vue-jsx-merge-props:  2.0.3
    babel-plugin-transform-vue-jsx:  4.0.1
    eslint-plugin-vue: ^5.0.0-0 => 5.0.0
    vue: ^2.5.17 => 2.5.21
    vue-eslint-parser:  2.0.3
    vue-hot-reload-api:  2.3.1
    vue-loader:  15.4.2
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.5.17 => 2.5.21
    vue-template-es2015-compiler:  1.6.0
  npmGlobalPackages:
    @vue/cli: Not Found

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 3
  • Comments: 69

Most upvoted comments

yeah, this is the same error. I am working on it.

jspdf.debug.js?6964:22371

What does this mean? line 6964 at character 22371? jspdf.debug.js doesnt have this position.

I checked right now jspdf.debug.js. charAt is used 34 times. The only case where a charAt exception could still happen, would mean, that you supplied invalid data for a custom font.

I made very small changes. Check the following dist-files.

Removing dist zip

But lets be honest: If this doesnt fix your issue, the problem is on your side and not on my side. Probably you use a framework which builds the code. So just changing the files in the modules folder is not enough. you have to recompile your source after changing the libs. If you can’t change the jspdf lib, then wait till we release the next version.

Hi @arasabbasi, i’ve tried your zip but the import isn’t working with none of the following import methods:

import * as jsPDF from 'jspdf'

or 

import jsPDF from 'jspdf' // ts: Module '"jspdf"' has no default export.

or

declare var jsPDF: any;

script i’m using:

import * as jsPDF from 'jspdf'

const doc = new jsPDF({
  orientation: 'landscape',
  unit: 'in',
  format: [4, 2]
})

doc.text('Hello world!', 1, 1)
doc.save('two-by-four.pdf')

i don’t get any import errors in ts-lint, but when i try to save the file nothing happens and no errors are shown in console.

dependencies:

angular: "@angular/core": "^6.1.0", jspdf: "jspdf": "^1.4.1", // downgraded but has your files in node_modules jspdf-autotable: "jspdf-autotable": "^2.3.5", typescript: "typescript": "~2.9.2"

hope it helps smh 😃

@kenanaReda if you downgrade jspdf to 1.4.1 that gets rid of the error. @snimmagadda1 html2pdf latest seems to work with jspdf 1.4.1 as well.

James just released v 1.5.3 !!!

Update your projects 😃

I made some changes, please try these files.

Removed the dist.zip

Use import * as jspdf from ‘jspdf/dist/jspdf.node.debug.js’; This includes the addImage method but it doesnot include SaveAs method sot it will give you an error of SaveAs method. Next step is to add the code below in jspdf.node.debug.js for save method, just copy paste it and it will work.

(function (global, factory) { if (typeof define === “function” && define.amd) { define([], factory); } else if (typeof exports !== “undefined”) { factory(); } else { var mod = { exports: {} }; factory(); global.FileSaver = mod.exports; } })(window, function () { /*

var _global = typeof window === ‘object’ && window.window === window ? window : typeof self === ‘object’ && self.self === self ? self : typeof global === ‘object’ && global.global === global ? global : void 0;

function bom(blob, opts) { if (typeof opts === ‘undefined’) opts = { autoBom: false };else if (typeof opts !== ‘object’) { console.warn(‘Depricated: Expected third argument to be a object’); opts = { autoBom: !opts }; } // prepend BOM for UTF-8 XML and text/* types (including HTML) // note: your browser will automatically convert UTF-16 U+FEFF to EF BB BF

if (opts.autoBom && /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(blob.type)) {
  return new Blob([String.fromCharCode(0xFEFF), blob], {
    type: blob.type
  });
}

return blob;

}

function download(url, name, opts) { var xhr = new XMLHttpRequest(); xhr.open(‘GET’, url); xhr.responseType = ‘blob’;

xhr.onload = function () {
  saveAs(xhr.response, name, opts);
};

xhr.onerror = function () {
  console.error('could not download file');
};

xhr.send();

}

function corsEnabled(url) { var xhr = new XMLHttpRequest(); // use sync to avoid popup blocker

xhr.open('HEAD', url, false);
xhr.send();
return xhr.status >= 200 && xhr.status <= 299;

} // a.click() doesn’t work for all browsers (#465)

function click(node) { try { node.dispatchEvent(new MouseEvent(‘click’)); } catch (e) { var evt = document.createEvent(‘MouseEvents’); evt.initMouseEvent(‘click’, true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null); node.dispatchEvent(evt); } }

var saveAs = _global.saveAs || // probably in some web worker typeof window !== ‘object’ || window !== _global ? function saveAs() {} /* noop */ // Use download attribute first if possible (#193 Lumia mobile) : ‘download’ in HTMLAnchorElement.prototype ? function saveAs(blob, name, opts) { var URL = _global.URL || _global.webkitURL; var a = document.createElement(‘a’); name = name || blob.name || ‘download’; a.download = name; a.rel = ‘noopener’; // tabnabbing // TODO: detect chrome extensions & packaged apps // a.target = ‘_blank’

if (typeof blob === 'string') {
  // Support regular links
  a.href = blob;

  if (a.origin !== location.origin) {
    corsEnabled(a.href) ? download(blob, name, opts) : click(a, a.target = '_blank');
  } else {
    click(a);
  }
} else {
  // Support blobs
  a.href = URL.createObjectURL(blob);
  setTimeout(function () {
    URL.revokeObjectURL(a.href);
  }, 4E4); // 40s

  setTimeout(function () {
    click(a);
  }, 0);
}

} // Use msSaveOrOpenBlob as a second approach : ‘msSaveOrOpenBlob’ in navigator ? function saveAs(blob, name, opts) { name = name || blob.name || ‘download’;

if (typeof blob === 'string') {
  if (corsEnabled(blob)) {
    download(blob, name, opts);
  } else {
    var a = document.createElement('a');
    a.href = blob;
    a.target = '_blank';
    setTimeout(function () {
      click(a);
    });
  }
} else {
  navigator.msSaveOrOpenBlob(bom(blob, opts), name);
}

} // Fallback to using FileReader and a popup : function saveAs(blob, name, opts, popup) { // Open a popup immediately do go around popup blocker // Mostly only avalible on user interaction and the fileReader is async so… popup = popup || open(‘’, ‘_blank’);

if (popup) {
  popup.document.title = popup.document.body.innerText = 'downloading...';
}

if (typeof blob === 'string') return download(blob, name, opts);
var force = blob.type === 'application/octet-stream';

var isSafari = /constructor/i.test(_global.HTMLElement) || _global.safari;

var isChromeIOS = /CriOS\/[\d]+/.test(navigator.userAgent);

if ((isChromeIOS || force && isSafari) && typeof FileReader === 'object') {
  // Safari doesn't allow downloading of blob urls
  var reader = new FileReader();

  reader.onloadend = function () {
    var url = reader.result;
    url = isChromeIOS ? url : url.replace(/^data:[^;]*;/, 'data:attachment/file;');
    if (popup) popup.location.href = url;else location = url;
    popup = null; // reverse-tabnabbing #460
  };

  reader.readAsDataURL(blob);
} else {
  var URL = _global.URL || _global.webkitURL;
  var url = URL.createObjectURL(blob);
  if (popup) popup.location = url;else location.href = url;
  popup = null; // reverse-tabnabbing #460

  setTimeout(function () {
    URL.revokeObjectURL(url);
  }, 4E4); // 40s
}

}; _global.saveAs = saveAs.saveAs = saveAs;

if (typeof module !== ‘undefined’) { module.exports = saveAs; } });

corrected the readme

@kenanaReda

We have an issue with the exports. I am fixing it right now.

@arasabbasi this library which uses jspdf- https://github.com/eKoopmans/html2pdf. I was referencing it b/c it seemed like @StaverDmitry was also using? I’m seeing the TypeError: e.charAt is not a function…