نصب کردن
حالا که شما متوجه شدید که sass چیست ، میتوانیم وارد مرحله بعد که همان نصب کردن sass میباشد ، برویم.
البته طریقه نصبی که در اینجا برای شما خواهم گفت برای کاربران ویندوز است ، و نصب sass بر روی لینوکس و مک به روش دیگری انجام می شود.
چون sass با استفاده از ruby نوشته شده است شما باید ruby را بر روی ویندوز خود نصب کنید بعد از اینکه این برنامه را دانلود کردید . در مرحله اول نصب پنجره ای شبیه به پنجره زیر برای شما نمایان میشود. دقت داشته باشید که در این مرحله شما باید تیک گزینه دوم را بزنید. و بعد بقیه مراحل را انجام دهید.
مرحله ۲- استفاده از خط فرمان command prompt برای نصب sass
حال که نرم افزار ruby را نصب کردید، شما میتوانید به راحتی sass را بر روی کامپیوتر خود نصب کنید. برای این کار command خود را باز کنید . و خط زیر را در خط فرمان بنویسید.
|
gem install sass |
بعد از اینکه اینتر زدید، چند لحظه صبر کنید تا نصب تکمیل شود. اگر در هنگام نصب به مشکل برخوردید و نصب انجام نشد، مجددا کد بالا را در خط فرمان بنویسید تا نصب انجام شود و پنجره ای شبیه به پنجره زیر مشاهده کنید.
برای اینکه شما بتوانید از تمام قابلیت های sass استفاده کنید میتوانید در همین مرحله compass را نیز نصب کنید.
|
gem install compass |
با خط بالا هم sass و هم compass به صورت همزمان نصب خواهد شد .
مرحله ۳- تنظیمات فایل sass
خوب تا اینجا ما sass را روی سیستم خود نصب کرده ایم . حالا میتوانیم که فایل sass خود را ایجاد کنیم . برای اینکه کدهایی که ما در sass مینویسیم به صورت خودکار به فایل css کامپایل شود میتوانید در خط فرمان دستوری شبیه خط زیر را بنویسیم .
|
<sass –watch <YOUR_SASS_FILE>:<YOUR_CSS_FIL |
برای مثال
|
sass –watch style.scss:style.css |
در این صورت ما در فایلی با پسوند scss کد های خود را وارد میکنیم و به محض ذخیره کردن فایل خود فایل css ما ساخته می شود .
البته توجه داشته باشید خط فرمان شما باید بر روی پروژه خود قرار دهید ( با استفاده از دستور cd )
مثالی از کار با selector sass و compass :
فایل screen.sass:
تبدیل کد بالا به فرمت css:
مثالی که در آن به آموزش متغیرهاوتوابع built in و import کردن یک css درون sass.
فایل ie.sass که قرار است در screen.sass مورد استفاده قرار بگیرد.
فایل screen.sass:
