pdfmake insert image

[jmg1340]

Hello,
I want to use a pdfmake library. I have this library in “statics/js”
To use it, I’ve got a button in a component that fires a method of pdfmake to generate a pdf in a new window.

In the component (src/pages/checkListPdf.vue):

import docDef from "./documentDefinition.js";

Method in a component (with q-img component to check if soruce image works or not)

      generarPDF: function () {
        // change q-img src component and it works !!!
        this.foto = "statics/logo.jpg"
        
        // opens new window with pdf content
        pdfMake.createPdf(docDef(this.foto)).open()
      }

PdfMake needs an object with special properties to perform the pdf conent (it’s also known as “document definition”).
I’ve written a custom module only to build de object (“document definition”) in a “documentDefinition.js” file.

src/pages/pdfmake/documentDefinition.js

export default function (imatge) {
	
	var dd = 
	{
		pageSize: 'A4',
		content: [
		    {
		      // image: require('assets/logo.jpg'),
		      // image: require('/statics/logo.jpg'),
		      image: imatge,
		      width: 150
		    },
		    {
			text: 'This is an example\n',
			fontSize: 30, bold: true, margin: [ 2, 240], alignment: "center"
		    },
		],
	}

	return dd 
}

If I do not put object image in content propety array, it works (pdf opens in a new window with the text)
If I add the object image, then console throws the following error:

[Vue warn]: Error in v-on handler: “Invalid image: File ‘./statics/logo.jpg’ not found in virtual file system
Images dictionary should contain dataURL entries (or local file paths in node.js)”

The file exists at “src/statics” and it works in the component.
In the documentDefinition.js I’ve also tried putting…
image: ‘statics/logo.jpg’
image: ‘/statics/logo.jpg’
image: ‘…/…/statics/logo.jpg’

[dazaizone]

This post is deleted!