Reputation: 197
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:
Upvotes: 0
Views: 777
Reputation: 2821
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
Upvotes: 1