/plugma

CLI that simplifies creating Figma plugins

Primary LanguageJavaScript

logos

Plugma

Warning

Plugma is currently in alpha. Your feedback is greatly appreciated!

Plugma simplifies Figma plugin development.

Start from a template

Create a plugin from a template using the following:

npm create plugma@latest

Requirements

The frameworks currently supported are React, Svelte and vanilla JavaScript.

Install

Create a plugin from scratch or use the CLI independently.

npm install plugma

Commands

plugma dev

Start a server to develop your plugin.

Options

  • port, -p: Specify a port number for the plugin preview, default is 3000.

plugma build

Create a build ready for publishing.

Options

  • --watch, -w: Watch for changes and rebuild automatically.

Manifest

You can either place a manifest.json file in the root of the project or add a plugma.manifest field to the package.json file.

How does it work?

Plugma uses Vite to bundle Figma plugins and is configured to inline all styles and scripts into one file. It uses a local server for development, that passes messages from Figma's main thread to the local server using web sockets.

Acknowledgments

I would like to thank Yuan Qing Lim's Create Figma Plugin for the inspiration for this project.