چله تابستون 🔥 چله تخفیف استثنایی راکت، این فرصت دیگه پیش نمیاد!
فرصت محدود، تعداد محدوددرود بر دوستان گرامی
من در حال یادگیریه تلویند نصخه چهارم و تلویند رو به صورت CLI استفاده میکنم و از جایی که کد npx tailwindcss init داخل این نصخه حذف و غیر فعال شده فایل کانفیگ رو به صورت دستی ایجاد کردم اما شخصی سازی ها اعمال نمیشن
ساختار پروژه :
start-tealwind/
│
├── Css/
│ ├── input.css
│ └── output.css
│
├── Html/
│ └── document.html
│
├── node_modules/ ← (پوشه اتوماتیک نصبشده توسط npm)
│
├── package.json
├── package-lock.json
└── tailwind.config.js
فایل کانفیگ :
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./Html/**/*.{html,js}"],
theme: {
extend: {
margin: {
6.5 : "90px",
},
},
},
plugins: [],
}
و فایل اچ تی ام ال :
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../Css/output.css">
</head>
<body>
<h1 class="m-6.5 text-red-950 text-2xl">
Hello world!
</h1>
<p class="text-red-950 ml-6">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aspernatur, debitis omnis repellat quas magni sed error repudiandae similique sunt mollitia quia, velit repellendus provident aperiam, iure illum dolorum ducimus ipsa?
</p>
<div class="bg-amber-400"><h1 class="text-blue-600 mx-7">Hello red</h1></div>
</body>
</html>
مابقی فایل ها دست نخوردن و طبق مستندات خود تلویند ایجاد شدن مستندات راه اندازی به صورت CLI
اگه نکته ای هست یا میتونید راهنمایی کند لطفا دریغ نکنین و بگید 🙏
سلام
توی نسخه ۴ هم میشه با فایل کانفیگ کار کرد هنوز اگه نیاز داشته باشی، شایدم مشکلت اینجا این باشه ک 6.5 رو باید توی کوتیشن بزاری.
حالا درکل، الان دیگع کاستومایزیشنها رو باید توی همون فایل اینپوت بنویسی.
الان دیگه باید توی هر لایهای که میخوای تغییری ایجاد کنی، همون لایه رو طبق سینتکس layer@ توی فایل اینپوت باز کنی و دیتا واردش کنی به این روش:
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer utilities {
.text-brand {
color: #00aaff;
}
}
لایههای کامپوننت و بِیس هم همینطوره. مثل سابقه فقط باید درک کرده باشی که تغییراتی که توی کانفیگ انجام میدادی، متعلق به کدوم لایه هستن و از الان توی لایهی مخصوص به خودش بنویسیش..
کلاسهای جدید رو توی یوتیلیتیز بنویس مثل مثالی ک زدم.
من خودم پروژههارو با ۳ میزنم فعلا و الان دسترسی ب سیستم ندارم برای تست دقیق، اگ مشکلی بود منشن کنید فردا اکی میکنیم.
تغییرات کانفیگ، کلیاتش همین بوده
موفق باشی✨
سلام
توی tailwind نسخه ۴ باید فایل کانفیگ رو توی فایل css بنویسی و اگر میخوای از tailwind.config.js استفاده کنی باید tailwind آخرین نسخه ۳ رو نصب کنی
https://tailwindcss.com/blog/tailwindcss-v4#css-first-configuration
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟