Figma connect interactive setup breaks due large design file

[rodrigolungui]

• Code Connect CLI version: 1.3.0
• OS: macOS Sequoia 15.3
• Node version: v20.17.0

I’m working on a exploration task around Code Connect for our internal Design System. When trying to set up code connect with our main design file using the interactive setup I got an error:

Script: npx figma connect

Failed to fetch components from Figma (400): 400 Request too large. If applicable, filter by query params.

I'm assuming it happened because our design file is too large, but could you possibly give me some more information about it? Which rules are applied? Is there any "number" we can take a look at on Figma to avoid this situation?

Also, want to share that in our case, I asked for another design file with a limited number of components, and it worked well! Thank you in advance!!

[rrabherufigma]

Hi @rodrigolungui . Thank you. We are are planning to work on a fix for this case where design files are too large to be returned. At present, there isn't any number or indicator that a file may run into this issue.

In the meantime, a workaround is to use the npx figma connect create on a per component basis

[SladkovAB]

Hi @rodrigolungui . Thank you. We are are planning to work on a fix for this case where design files are too large to be returned. At present, there isn't any number or indicator that a file may run into this issue.

In the meantime, a workaround is to use the npx figma connect create on a per component basis

I have the same problem. Can you please explain in more detail what "use the npx figma connect create on a per component basis" means.

[slees-figma]

We've just released a server-side fix for reducing the payload size used by the CLI. From our testing it looks like this should fix this problem for all design files. Closing for now but please reopen if you see further issues!

Can you please explain in more detail what "use the npx figma connect create on a per component basis" means.

@SladkovAB hopefully resolved by the above but you can otherwise connect components individually with the command npx figma connect create <YOUR_COMPONENT_URL>. This command will fetch your component info from figma and generate a single Code Connect file for it.