Package یا بسته‌یی که در ادامه به معرفی آن می‌پردازم یک بسته‌ی کم‌حجم، ساده و کارآمد است که با زبان جاوااسکریپت نوشته شده، از سه minifier قدرتمند Terser ، clean-css و html-minifier-terser برای کاهش حجم، بهره گرفته و بسته به تایپ فایل موردنظر، از آن‌ها استفاده خواهد کرد. این بسته یک ابزار CLI است که بعد از اجرا در پس‌زمینه، زنده و آماده‌باش خواهدماند تا هر تغییر را در خروجی اعمال کند.
ویژگی‌ها
✅ JavaScript، CSS و HTML را کم‌حجم می‌کند.
✅ از Live file-watching برای ذخیره‌ی خودکار و زنده‌ی فایل‌ها، استفاده می‌کند.
✅ گزینه‌های مختلفی برای تنظیمات دارد.
✅ سبک است و استفاده از آن آسان!
نصب
موارد مورد نیاز:
Node.js نسخه‌ی ۱۶+
npm نسخه‌ی ۸+
نصب این بسته به دو روش انجام‌پذیر است. ۱. به صورت محلی یا Local و فقط برای پروژه‌ی موردنظر و ۲. به صورت جهانی یا Global برای اجرا در همه‌ی پروژه‌ها
نصب Local
npm install --save-dev minifixنصب Global
npm install --global minifixاجرا
فرآیند اجرای این بسته هم بستگی به انتخاب شما در هنگام نصب دارد و به دو روش Global و Local ممکن است.
اجرا برای Local
npx minifixاجرا برای Global
minifixپیکربندی
بعد از نخستین اجرا، یک فایل minifix.config.mjs در همان پوشه‌یی که دستور اجرا را انجام داده‌اید ساخته می‌شود. این فایل پیکربندی برنامه است. در این فایل، ورودی‌ها یا inputs و خروجی‌ها یا outputs و همچنین تنظیمات فشرده‌سازی یا minifyOptions، قابل تنظیم هستند.
بعد از نخستین دستور اجرا، برنامه فایل minifix.config.mjs را می‌سازد (در صورت عدم وجود) و سپس خارج می‌شود، در نتیجه، بعد از اعمال تغییرات موردنظرتان در minifix.config.mjs، برنامه باید دوباره اجرا شود. در اجراهای بعدی، برنامه سعی در ساخت minifix.config.mjs نخواهد کرد، خارج نخواهد شد و زنده و آماده‌باش، باقی خواهدماند.
inputs
مسیر فایل یا فایل‌هایی که می‌خواهید عملیات کاهش حجم روی آن‌ها اجرا شود را در این بخش وارد کنید. مبنای مسیر، از جایی که فایل minifix.config.mjs وجود دارد حساب می‌شود. مثال:
inputs: ["assets/js/example1.js","assets/js/example2.js"]outputs
مسیر فایل یا فایل‌های خروجی برای ذخیره‌سازی را در این بخش وارد کنید. مبنای مسیر، از جایی که فایل minifix.config.mjs وجود دارد حساب می‌شود. این فایل‌ها توسط خود برنامه در مسیر معین شده ایجاد خواهد شد. مثال:
outputs: ["assets/js/output1.js","assets/js/output2.js"]نخستین مسیر خط بالا، نخستین خروجی است و نسخه‌ی فشرده‌شده‌ی نخستین ورودی را در خود جای خواهد داد و دومین مسیر خروجی، مربوط به دومین ورودی خواهد بود و به همین ترتیب هر کدام از ورودی‌ها به این شکل در مسیرهای خروجی، ایجاد و محتوای آن‌ها، به صورت زنده، فشرده و ذخیره خواهند شد.
هنگامی که برنامه اجرا شده و شما در حال تغییر
assets/js/example1.jsهستید، این فایل درassets/js/output1.jsبا اعمال آخرین تغییرات شما اعمال می‌شود، حجم محتوا کاهش پیدا می‌کند و در فایل تازه‌‌ایجادشده ذخیره می‌شود و تا زمانی که برنامه زنده و در حال اجرا باشد این روند ادامه خواهد داشت.
نکته: اگر outputs خالی باشد برنامه از کار نمی‌افتد و خودش در همان مسیر ورودی مربوطه، یک فایل با پسوند _output_ خواهد ساخت.
minifyOptions
این بخش از پیکربندی وابسته به تنظیمات سه بسته‌ی Terser ، clean-css و html-minifier-terser است. هرکدام را می‌توانید با توجه به تایپ فایل موردنظر، تنظیم کنید. مثلا:
minifyOptions: {
css: {
format: false
},
js: {
format: {
preamble: "/** Comment */"
}
},
html: {
collapseWhitespace: true,
removeComments: true,
removeRedundantAttributes: true
}
}تنطیمات CSS در این لینک، تنظمیات مربوط به JS(JavaScript) در این لینک و تنظیمات HTML در این لینک قابل مشاهده هستند.
مثالی از فایل پیکربندی
/* minifix.config.mjs */
export default {
inputs: ["views/input.html", "assets/css/input.css", "assets/js/input.js"],
outputs: ["views/index.html", "assets/css/style.css", "assets/js/default.js"],
minifyOptions: {
css: {
format: false
},
js: {
format: {
preamble: "/** Comment */"
}
},
html: {
collapseWhitespace: true,
removeComments: true,
removeRedundantAttributes: true
}
}
};پسوندهای قابل تشخیص
JavaScript (.js,.mjs,.cjs)
HTML (.html,.htm)
CSS (.css)
کارایی
minifix به گونه‌یی طراحی شده که یک راه‌حل یک‌مرحله‌یی و سبک برای کاهش حجم فایل‌های پروژه‌ی شما باشد.
ویژگی Live file-watching آن تضمین می‌کند که در زمان اجرای برنامه در پس‌زمینه، فایل‌های شما با هر تغییر همچنان به‌روز خواهند ماند.
گزینه‌های مختلف پیکربندی، به شما امکانات زیادی در فرآیند کاهش حجم می‌دهند.
ابزارهای مشابه بسیاری برای این منظور در دسترس هستند اما minifix هم با توجه به اینکه سعی شده قابلیت آماده‌ماندن در پس‌زمینه داشته باشد و از سه ابزار کاهش حجم قدرمند با قابلیت پیکربندی مختلف و مجزا بهره ببرد و در نهایت ویژگی سبک‌بودن بسته، امیدوار است برای استفاده‌ی توسعه‌دهندگان مناسب باشد. بنابراین چه در حالِ کار بر روی یک پروژه کوچک باشید و چه یک برنامه‌ی کاربردی در مقیاس بزرگ را می‌نویسید، این ابزار می‌تواند به شما در کاهش حجم کدها و درنتیجه به بهبود کارایی و عملکرد پروژه‌تان کمک کند.
امتحان کنید و دیدگاه خود را با من درمیان بگذارید!
برای فرستادن پرسش و یا گزارش ایراد، می‌توانید از طریق issues مخزن پروژه در GitHub، اقدام کنید.
اطلاعات برنامه
نام: minifix
پلتفرم: Node.js
زبان: JavaScript
لایسنس: MIT
تاریخ انتشار اولیه: ۱ اسفند ۱۴۰۳
تاریخ آخرین به‌روزرسانی: ۲ اسفند ۱۴۰۳
مخزن: GitHub
باحال بود، لذت بردم. منو به فکر فرو بردی من چه لایببری‌ای میتونم بسازم 🙂
سپاس از تو علی جان. خوشحالم کردی… موفق باشی!