Error: Installing plugin/preact-tailwindcss Issue

[nrl-izah]

Hi, I come across this toolkit and want to to install it. I have followed the instructions as per in this link: https://yuanqing.github.io/create-figma-plugin/quick-start/, using npx --yes create-figma-plugin. I then chose plugin/preact-tailwindcss. After everything is install and cd to preact-tailwindcss folder, I followed the npm run build command. But I encounter the issue in this picture, so I am quite lost on how to proceed. I wouldn't be able to create the figma plugin if I don't have the manifest.json file:

This is quite urgent for me so can anyone help me on this?

[tresorama]

I never used but this is what I would do:

• Add "npx" prefix to build:css script inside package json, sometimes it's needed
• check if the installed tailwind is v3or v4, because the current version is 4 but when this library was created tailwind was at version 3 , and maybe v4 changed the name of the cli command. So try to use v3 and see if breaks again
• make "tailwindcss" command works directly in terminal, then migrate the fix to package json

[ben-katz]

@nrl-izah

Like @tresorama suggested, I looked at tailwind v4 to see if the CLI changed, and it did.

I had to edit the scripts in package.json (and make sure the latest tailwind CLI is installed):

"scripts": {
    "build": "npm run build:css && npm run build:js",
    "build:css": "npx @tailwindcss/cli -i ./src/input.css -o ./src/output.css",
    "build:js": "build-figma-plugin --typecheck --minify",
    "watch": "npm run build:css && concurrently npm:watch:css npm:watch:js",
    "watch:css": "npx @tailwindcss/cli -i ./src/input.css -o ./src/output.css --watch",
    "watch:js": "build-figma-plugin --typecheck --watch"
  },

Note the new /cli after the the @tailwind commands that is required for TW v4.

v4 Guide: https://tailwindcss.com/docs/upgrade-guide#using-tailwind-cli

[yuanqing]

Thanks @nrl-izah for reporting and @ben-katz for the suggested fix. This will get patched in 4.0.2