Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Big problem in vfs_fonts. Objects are not extensible (React + Vite) #2726

Open
PandukaNandara opened this issue May 10, 2024 · 2 comments
Open

Comments

@PandukaNandara
Copy link

I am using React with Vite. There is a serious problem needed to be addressed related to vfs_fonts. I am unable to set the vfs_fonts according to the outdated documentation.

// Not even working in locally ❌ 
import * as pdfMake from "pdfmake/build/pdfmake";
import * as pdfFonts from 'pdfmake/build/vfs_fonts';

// Also this is an illegal assignment. Imports are readonly  ❌  ❌ 

(<any>pdfMake).vfs = pdfFonts.pdfMake.vfs;

When I apply this code, I am getting the following error.

src/reports/barcode/BarcodeReport2.ts (22:13) Illegal reassignment of import "pdfMake" in "src/reports/barcode/BarcodeReport2.ts".

Then I figured out how to do this without getting an error locally.

// eslint-disable-next-line no-import-assign
Object.defineProperty(pdfMake, 'vfs', {
  value: vfs_fonts,
  writable: false, // optional, makes it read-only
});

But in the built version I am getting the following error.

Why the fuck can't you fix this yet?

It is so pathetic that developers of the plugin have managed to build one of the best pdf generator library but still not be able to implement a simple function to set the vfs_fonts like this.

import * as pdfMake from 'pdfmake/build/pdfmake';
import * as pdfFonts from 'pdfmake/build/vfs_fonts';

pdfMake.setVfs(pdfFonts)
@beppo-ivel
Copy link

beppo-ivel commented Jun 4, 2024

Removing the * as syntax worked for me.

https://stackoverflow.com/questions/69468718/using-pdfmaker-in-typescript#comment122787297_69468718

https://github.com/bpampuch/pdfmake/issues/1877#issuecomment-2148594824

@DaanH
Copy link

DaanH commented Oct 12, 2024

Using Vite and Typescript, I manged to fix this by:

  1. rename vfs_fonts.js to vfs_font.ts
  2. in the vfs file change content to const vfs = { 'fontName-bodl.ttf': '...', ...}; export default vfs;
  3. in the actual code import vfs with regular import and lazy import pdfmake like this:
import vfs from './vfs_fonts';

export const generatePdf = async () => {
    const { default: pdfMake } = await import('pdfmake/build/pdfmake');
    pdfMake.vfs = vfs;
    ...

Here, the default in const { default: pdfMake } was essential.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants