Issue
Having simple html:
public/index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body class="text-red-600">
some text
</body>
where the css was obtained from tailwindcss -i src/styles.css -o public/styles.css
src/styles.css:
@tailwind base;
@tailwind components;
@tailwind utilities;
tailwind.config.js:
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
plugins: [],
}
the red color from <body> tag does not apply. Are default tailwind classes imported into public/styles.css?
Solution
It seems like the public/index.html file is not covered by the content file globs in your Tailwind configuration. You must ensure that source code files that use Tailwind classes are covered by the content file globs, otherwise Tailwind will not scan these files and will not generate CSS rules for class names present. Consider reading the documentation on configuring content.
module.exports = {
content: [
"./src/**/*.{html,js}",
"./public/index.html",
],
theme: {
extend: {},
},
plugins: [],
}
Answered By - Wongjn
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.