jsPDF
jsPDF copied to clipboard
ES6 import does not work with disabled AMD parser in webpack
Webpack allows to disable AMD parsing - for a good reason - with the following option: https://webpack.js.org/configuration/other-options/#amd. But when the AMD parser is disabled, it gives the following error:
Uncaught TypeError: Cannot read property 'name' of undefined
at new s (main.js:206)
at Module.<anonymous> (main.js:206)
at n (main.js:1)
at main.js:1
at main.js:1
After some further debugging and setting a breakpoint in the main.js
at the line const i = new r;
you can clearly see that the r
variable only has the saveAs
function. All the other functions are missing.
It can be reproduced with the following configuration:
package.json
:
{
"dependencies": {
"jspdf-yworks": "2.1.1",
"webpack": "4.43.0",
"webpack-cli": "3.3.11"
},
"scripts": {
"build": "webpack"
}
}
webpack.config.js
:
const webpack = require('webpack');
module.exports = {
entry: './app.js',
module: {
rules: [
{
parser: {
amd: false,
},
},
],
},
};
app.js
import * as jsPDF from 'jspdf-yworks/dist/jspdf.debug';
const pdf = new jsPDF();
console.log(pdf);
index.html
<!doctype html>
<html>
<head>
<title>Test</title>
</head>
<body>
<script src="./dist/main.js"></script>
</body>
</html>
Using
import * as jsPDF from 'jspdf-yworks';
or
import jsPDF from 'jspdf-yworks';
doesn't change anything.
However it works when using
import * as jsPDF from 'jspdf-yworks/dist/jspdf.node.min';
But it feels wrong using the node version to fix this issue. In my opinion it should work with disabled AMD parser and importing it like:
import jsPDF from 'jspdf-yworks';
Yes that's definitively something we should improve with the next release.