خطا در input گرفتن tailwindcss
وقتی از فایل input.css میخوام input بگیرم با خطای زیر مواجه میشم. مشکل کجاست؟
پاسخها
3
سلام دوست عزیز
لطفا فایل tailwind.config.js رو باز کن و ببین که به شکل زیر باشه
اگر مستندات tailwind رو مرحله مرحله دقت کنی فایل و ادرس کامل توش هست
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
plugins: [],
}ولی این خطا نیست میگه من کلاس تیلویندی پیدا نکردم که بخام کار خاصی بکنم شما توی index.html کد زیر رو کپی کن
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://roocket.ir/dist/output.css" rel="stylesheet">
</head>
<body>
<h1 class="text-3xl font-bold underline">
Hello world!
</h1>
</body>
</html>نمیدونم چرا ولی باز هم همین اتفاق افتاد
داداش ببین
توی کانفیگ گفتی هر چیزی که توی پوشه ی src هست رو بیا برو برام کلاس هاشو پیدا کن ولی شما رفتی index رو توی پوشه public قرار دادی
(طبق مستندات که پیش رفتی src/index.html رو اگر دقت کنی توی مثالی که زده خودش توی src گزاشته)
بیا و به شکل زیر عمل کن یعنی پوشه public رو هم توی کانفیگ بگو چک کنه برات ک کلاسی داره یا نه
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{html,js}",
"./public/**/*.{html,js}",
],
theme: {
extend: {},
},
plugins: [],
}
]و اشتباه دوم شما اینه که توی پوشه public هستی ولی ادرس دهیت برای کلاس css میگه بیا همینجا و پوشه dist رو باز کن در صورتی که اون یه مرحله عقب تره
کد html باید به شکل زیر بشه من رنگ متن رو هم عوض کردم که تابلو تر دیده بشه
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://roocket.ir/./../dist/output.css" rel="stylesheet">
</head>
<body>
<h1 class="text-3xl font-bold underline text-red-500 bg-red-100">
Hello world!
</h1>
</body>
</html>خروجی باید به شکل زیر بشه
</body></html>
گفتگوهای مرتبط
شاید پاسخ شما همینجا باشد