Figma plugin with JSZIP

What are your build settings for the bundler you are using? Also if you are trying to use it on the plugin backend, it’s a limited environment so it might not work, so try using it in the plugin UI and then pass the data to the backend.

I did as below.

1. Created a figma file in figma desktop
   

2. Created a figma plugin with UI

3. Opened the created plugin folder in Visual studio code

4. In terminal, npm install --save-dev @figma/plugin-typings

it created this additional packages

5. Did run build task then tsc watch

6. Ran plugin in figma file and created orange rectangles!

7. I downloaded JSZIP npm i jszip

8. updated tsconfig.json
   {
   “compilerOptions”: {
   “target”: “es6”,
   “lib”: [“es6”,“dom”],
   “noImplicitAny”: false,
   “strict”: true,
   “typeRoots”: [
   “./node_modules/@types”,
   “./node_modules/@figma”
   ]
   }
   }

Then error starts

it is coming after the lib dom is added

Ah I see. Make sure you are using the latest version of typings, try uninstalling them and installing again. This is not related to jszip library. See this issue. But also in order to use the library you’ll need to switch over to using bundlers such as Webpack, Esbuild, or other.

Thank you, it seems with the help of you that error gone. I am closer to my solution. It’s running but during run, I get another error.

Syntax error on line 7: Unexpected token

export interface ExportableBytes {
name: string;
setting: ExportSettingsImage | ExportSettingsPDF | ExportSettingsSVG;
bytes: Uint8Array;
}

Will search community forum

You don’t need to reinstall typescript, only the plugins API typings (npm install --save-dev @figma/plugin-typings)