راکت
حل شده

بهینه سازی استایل های بوت استرپ

5 پاسخ

سلام دوستان
همونطور که میدونید خیلی از کلاس های بوت استرپ رو ما استفاده نمیکنم اما به ناچار اوناهم هنگام لود صفحه بالا میان و حجم کدهارو بالا میبرن
آیا راهی هست که فقط از کلاسهایی که استفاده کردیم استفاده بشه و بقیش لود نشن؟مثل Tailwind

ثبت پرسش جدید

پاسخ‌ها

5
حامد نیرومند
حامد نیرومند
@hamedniroomand

تخصص: برنامه‌نویس

بهترین پاسخ

شما اگر از webpack در پروژه خودت استفاده کنی، براحتی با نصب پلاگین purgecss-webpack-plugin نه تنها بوت استرپ، بلکه هرفایل css/scss که استفاده کنی رو با html مقایسه میکنه و کلاس هایی که استفاده نکردی رو حذف میکنه و در نهایت یک فایل css کم حجم و مفید دراختیارت قرار میده. میتونی یک سری کلاس ها رو هم در safelist قرار بدی تا این ها رو حذف نکنه. مثل کلاس هایی که با جاوااسکریپت توی DOM اضافه میشن.

مهدی
مهدی
@mahdidv

تخصص: Backend Developer

من webpak رو نصب کردم و همچنین purgcss رو
فایل purgecss.config.js رو ایجاد کردم و طبق داکیومنت نوشتم اما زیاد سر در نیاوردم باید چکار انجام بدم
ممنون میشم راهنمایی کنید.

حامد نیرومند
حامد نیرومند
@hamedniroomand

تخصص: برنامه‌نویس

@mahdidv
یک کم نیاز به نصب لودرهای مختلف و کانفیگ webpack داره که اگر تابحال با webpack کار نکرده باشی ممکنه در انجام این کار اذیت شی و همینطور در یک کامنت نمیشه توضیح داد.
اجازه بده من امشب یا نهایت فردا این رو تحت یک مقاله در همین سایت راکت منتشر میکنم.

شاید پاسخ شما همین‌جا باشد

حامد نیرومند
حامد نیرومند
@hamedniroomand

تخصص: برنامه‌نویس

ظاهرا دیگه امکان انتشار مقاله در سایت راکت وجود نداره نمیدونم چرا!
مجبور شدم در ویرگول منتشر کنم:
چگونه استایل‌های اضافی و بلااستفاده در css را با استفاده از webpack حذف کنیم؟
ببخشید اگر متن خیلی روون نیست، یک کم عجله‌ای نوشتم ولی باز دوباره یک بازنگری و بازنویسی خواهم داشت. امیدوارم مورد استفاده قرار بگیره.

مهدی
مهدی
@mahdidv

تخصص: Backend Developer

آیا راهی هست که تمامی فایل های html موجود در فالدر pages رو به این صورت در بیاریم مثلا بجای index.html بگیم همه ی فایل های html موجود در فالدر Pages

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام