💻 آخرین فرصت یادگیری برنامه‌نویسی با آفر ویژه قبل از افزایش قیمت در ۵ آذر ماه (🎁 به همراه یک هدیه ارزشمند )
۰ ثانیه
۰ دقیقه
۰ ساعت
۱ دانیال بهنام کیا
نصب کامپایلر Sass روی PhpStorm
جامعه وردپرس (برنامه نویسی) ایجاد شده در ۲۸ تیر ۱۴۰۳

درود بر شما لطفا جهت نصب کامپایلر Sass در phpStorm یک توضیح یا لینک روش نصب بگذارید متشکرم

سلام و احترام
برای نصب و پیکربندی کامپایلر Sass در PhpStorm، مراحل زیر را دنبال کنید:

1. **نصب Node.js و npm**:
  اگر هنوز Node.js را نصب نکرده‌اید، ابتدا باید آن را دانلود و نصب کنید. با نصب Node.js، npm نیز به صورت خودکار نصب می‌شود. برای دانلود Node.js به [وب‌سایت رسمی Node.js](https://nodejs.org/) مراجعه کنید.

2. **نصب Sass با استفاده از npm**:
  پس از نصب Node.js، ترمینال یا خط فرمان را باز کنید و دستور زیر را اجرا کنید تا Sass را نصب کنید:

 npm install -g sass


  این دستور Sass را به صورت سراسری (global) نصب می‌کند و آن را برای استفاده در هر پروژه‌ای در دسترس قرار می‌دهد.

3. **پیکربندی PhpStorm برای استفاده از Sass**:
  در PhpStorm، مراحل زیر را دنبال کنید:
  - از منوی بالا، به مسیر `File > Settings` (در macOS به مسیر `PhpStorm > Preferences`) بروید.
  - در پنجره‌ی تنظیمات، به بخش `Languages & Frameworks > Stylesheets > Sass` بروید.
  - در بخش `Sass executable path`، مسیر اجرای Sass را وارد کنید. اگر Sass را به صورت سراسری نصب کرده‌اید، مسیر معمولاً `C:\Users\YourUsername\AppData\Roaming\npm\sass` در ویندوز و `/usr/local/bin/sass` در macOS و لینوکس خواهد بود.
  - در این بخش می‌توانید تنظیمات دلخواه خود را برای Sass اعمال کنید، مانند نقشه‌های منبع (source maps) و فایل‌های ورودی و خروجی.

4. **ایجاد و پیکربندی Watcher برای Sass**:
  برای این که PhpStorm به صورت خودکار تغییرات فایل‌های Sass را نظارت کرده و آن‌ها را کامپایل کند، باید یک File Watcher ایجاد کنید:
  - از منوی بالا به مسیر `File > Settings` (در macOS به مسیر `PhpStorm > Preferences`) بروید.
  - به بخش `Tools > File Watchers` بروید.
  - بر روی دکمه `+` کلیک کنید و `Sass` را انتخاب کنید.
  - در پنجره‌ی باز شده، تنظیمات زیر را انجام دهید:
    - در بخش `File Type`، نوع فایل را `SCSS` یا `SASS` انتخاب کنید.
    - در بخش `Scope`، محدوده‌ی فایل‌هایی که باید نظارت شوند را مشخص کنید.
    - در بخش `Output paths`، مسیر فایل‌های خروجی CSS را تعیین کنید.
    - در بخش `Arguments`، می‌توانید آرگومان‌های اضافی مورد نظر خود را برای کامپایل Sass وارد کنید.

با انجام این مراحل، PhpStorm به صورت خودکار تغییرات فایل‌های Sass شما را نظارت کرده و آن‌ها را به فایل‌های CSS کامپایل خواهد کرد.

بهنام مرادی ۲۸ تیر ۱۴۰۳، ۱۹:۵۹