I’m working on a basic Figma plugin and running into TypeScript issues. When I try to access properties on selected elements, TypeScript throws errors about missing type definitions.
Here’s my simple plugin code:
figma.showUI(__html__);
// Without this ignore comment, TS throws an error
console.log(figma.currentPage.selection[0].borderRadius);
The plugin works perfectly when I add the ignore comment, and it successfully gets the border radius from whatever shape I have selected. But without that comment, TypeScript gives me this error: “Property ‘borderRadius’ does not exist on type ‘SceneNode’.”
I’ve already installed the type definitions package, and here’s my tsconfig setup:
This happens because TypeScript’s type narrowing kicks in. The borderRadius property only exists on specific nodes like RectangleNode or EllipseNode - not on the generic SceneNode type that selection[0] gives you. TypeScript doesn’t know what kind of node you’ve selected, so it plays it safe with the base type. I hit this same issue with my first plugin. Here’s how to fix it: use type guards or type assertions. Either check the node type first with if (node.type === 'RECTANGLE') or use a type assertion like (figma.currentPage.selection[0] as RectangleNode).borderRadius if you’re sure about the node type. Also, make sure you’ve got /// <reference types="@figma/plugin-typings" /> at the top of your file. Way cleaner than ignore comments and you get proper type safety.
Your tsconfig is the problem. You’ve got typeRoots pointing to ./node_modules/@figma, but the Figma plugin types are in @figma/plugin-typings. Just remove the custom typeRoots completely - TypeScript finds types in node_modules/@types automatically. Also make sure you have this reference at the top of your main plugin file: /// <reference types="@figma/plugin-typings" />. I ran into this same issue setting up my plugin environment. The custom typeRoots was blocking TypeScript from finding the right type definitions. Removed it, added the reference directive, and all the Figma API types worked. Also double-check that @figma/plugin-typings is actually installed in your dependencies.
Check your package.json - make sure @figma/plugin-typings is listed as a dependency, not just devDependency. I wasted hours on this exact error because I installed it wrong. Yeah, the triple slash reference directive is important, but it’s useless if the package isn’t installed right. Also check your tsconfig includes field. If you’ve got an includes array, your plugin files need to be covered by it or TypeScript will just ignore them. Another gotcha - if you have multiple tsconfig files, make sure you’re editing the one that actually gets used for compilation. The borderRadius property exists on shape nodes, so this is definitely a TypeScript config problem.
Been there. The real issue is manual type checking every time you want to access node properties. Even with the reference directive, you’ll keep hitting these type narrowing problems.
I automate this with Latenode. Instead of writing TypeScript that constantly needs type assertions and manual property checks, I set up workflows that automatically handle Figma API calls and property extraction.
Here’s my setup: Latenode connects to Figma’s REST API and processes selected elements automatically. It grabs whatever properties I need (borderRadius, fills, constraints) without any TypeScript drama. The workflow runs when I trigger it from my plugin.
Latenode handles all the type checking in the background. No more wondering if a node has borderRadius. No more type assertions. Just clean automation that processes your selections and returns the data you need.
I’ve used this for several plugins where I needed to extract design tokens and component properties. Way more reliable than fighting TypeScript definitions every time Figma updates their API.
omg i had this too! def add /// <reference types="@figma/plugin-typings" /> at the top of your main ts file. also check if you installed it by running npm list @figma/plugin-typings just to be sure!