I’m a beginner working with TypeScript and JavaScript. I’ve decided to build my first design tool plugin by following the setup instructions on my Mac.
The Issue
During the compilation of my TypeScript file, I encounter this specific error:
/main.ts:12:1 - error TS2304: Cannot find name 'design'.
My Attempts
I diligently followed each instruction in the setup documentation. After that, I ran this command to install the plugin type definitions:
npm WARN saveError ENOENT: no such file or directory, open '/Users/myname/package.json'
npm WARN enoent ENOENT: no such file or directory, open '/Users/myname/package.json'
npm WARN myname No description
npm WARN myname No repository field.
npm WARN myname No license field.
+ @design-tool/[email protected]
updated 1 package and audited 1 package in 3.1s
found 0 vulnerabilities
My Code Snippet
The first line in my TypeScript code is as follows:
design.displayUI(__html__);
Coming from a background in C++, Swift, and Objective-C, I am accustomed to using import statements, but I cannot find any in this context. How should I approach this in TypeScript?
Those warnings mean npm’s trying to install packages without a proper project setup. You’re running the install command from your home directory instead of your plugin folder.
Here’s the fix:
Go to your actual plugin project directory (not /Users/myname/)
Run npm init -y to create a package.json file
Install the types without sudo: npm install --save-dev @design-tool/plugin-types
Make sure your tsconfig.json includes the types in the “types” array
Once the types are installed in the right spot, the design object should be globally available.
Honestly though, all these manual setup steps and config issues are exactly why I use automation tools. Instead of wrestling with TypeScript configs and npm installations, you could automate this whole plugin development workflow with Latenode. Set up automated builds, dependency management, and plugin deployment pipelines that just work without the troubleshooting headaches.
Those warnings mean npm can’t find a package.json file in your project directory. That’s why TypeScript isn’t recognizing the design object. Go to your project root and run npm init first, then install your dependencies. Once you’ve got the package.json file, reinstall the plugin types package - but don’t use sudo. Using sudo with npm on Mac creates permission headaches. Also check that your tsconfig.json has the right type definitions path so TypeScript can actually find the design object declaration. Once the types are installed and configured properly, the design object should be available globally.
u might be missing a package.json file. just run npm init -y in ur project folder b4 installing the plugin types. this will help TypeScript recognize the design object and clear those errors up.