Setup command of Tailwind CSS (compile and watch) does not end after many minutes

Question

I struggle to run a command for the first setup of Tailwind CSS, just by following this tutorial for Flask-Flowbite. The following command to compile and watch does not end after 30 min. I have to kill the process with CTRL+C. There are some questions in Stackoverflow but all solutions do not work for my case. Any idea what is the latest solution and/or what would be wrong with my case?

npx tailwindcss -i ./kg-app/static/src/input.css -o ./kg-app/static/dist/css/output.css --watch

Rebuilding...

warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
warn - https://tailwindcss.com/docs/content-configuration

Done in 130ms.

Depending on different solutions above, sometimes Warning appears, sometimes not.

tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    ".kg-app/templates/**/*.{html,js,jsx}",
    ".kg-app/static/src/**/*.{html,js,jsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

kg-app/static/src/input.css

@tailwind base;
@tailwind components;
@tailwind utilities;

I tried several path candidates in the content found in the solutions found in Stackoverflow, but no success. Note my folder structure is not the same as tutorial:

Before the command:

kg-app/static/src/input.css
tailwind.config.js

After the command, add this file:

kg-app/static/dist/css/output.css

BcK · Accepted Answer · 2024-04-03 08:18:05Z

1

With --watch switch, you tell tailwind to watch the files and compile it again in case of any changes. If you are waiting for that to end, it will not end and watch the files forever. Remove the switch and try again.

You can use the --watch or -w flag to start a watch process and automatically rebuild your CSS any time you make any changes:

https://v2.tailwindcss.com/docs/installation#watching-for-changes

answered Apr 3, 2024 at 8:18

BcK

2,8311 gold badge17 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user7665853 Over a year ago

Thank you, it was quickly done after 5 seconds! The tutorial for Flowbite above did not explain well what the command actually does. It should be clearly explained and updated. Cheers

Collectives™ on Stack Overflow

Setup command of Tailwind CSS (compile and watch) does not end after many minutes

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related