handlebars.js - How to make @tailwindcli run other npm scripts after --watch? - Stack Overflow

admin管理员组

文章数量:1405908

This is my package.json

  "scripts": {
    "dev:tailwind": "npx @tailwindcss/cli -i ./src/assets/styles/input.css -o ./dist/assets/styles/output.css",
    "dev:handlebars": "node ./handlebars.js",
    "dev": "run-s dev:handlebars dev:tailwind",
    "watch:tailwind": "npm run dev:tailwind -- --watch",
    "watch": "run-s dev && run-p watch:tailwind browsersync",
    "browsersync": "node ./browsersync.js"
  },

The above is my project flow. I don't use tools like gulpjs. I hope to use npm script as much as possible to achieve what I need.

The problem is that in "watch", dev:tailwind is actually executed twice, and the second time is with the --watch parameter, because --watch will not finish, and I have to wait for dev:handlebars to render the html file before using dev:tailwind, so that it can detect all the required classes. Is there a way to avoid executing dev:tailwind twice?

dev:handlebars needs to be rendered first, and then run dev:tailwind. What I need is to start brwosersync or other things I need after dev:tailwind starts executing the --watch action.

Just like "watch": "run-s dev && run-s watch:tailwind browsersync" Because watch:tailwind will not finish, browsersync will not be start, and I don't want them to be executed at the same time (run-p).

I tried using chokidar instead of tailwind's watch, but the effect was poor and too slow.

本文标签： handlebarsjsHow to make tailwindcli run other npm scripts after watchStack Overflow