آموزش استفاده از دستور error در Sass

آموزش Sass – استفاده از دستور @error

دستور @error مقدار یا نتیجه ی اجرای دستور SassScript را به صورت یک خطای مهلک به همراه اطلاعات جزئی و خط به خط اجرای دستورات مربوط به خطای مذکور (stack trace) در خروجی نمایش می دهد. این دستور به ویژه برای اعتبارسنجی و بررسی درستی آرگومان های ارسالی به mixin ها و توابع، کاربردی تلقی می شود. مثال:

@mixin adjust-location($x, $y) {
  @if unitless($x) {
    @error "$x may not be unitless, was #{$x}.";
  }
  @if unitless($y) {
    @error "$y may not be unitless, was #{$y}.";
  }
  position: relative; left: $x; top: $y;
}

در حال حاضر هیچ روشی در Sass برای ضبط و مدیریت خطاها تعبیه نشده است.

مثال کاربردی

در زیر یک فایل stylesheet را مشاهده می کنید که ظاهری مشابه فایل CSS داشته و با پسوند .scss ذخیره می شود.

warn.scss
$colors: (
   blue: #c0392b,
   black: #2980b9,
);
@function style-variation($style) {
   @if map-has-key($colors, $style) {
      @return map-get($colors, $style);
   }
   @error "Invalid color: '#{$style}'.";
}
.container {
   style: style-variation(white);
}

با اجرای دستور زیر می توانید به SASS دستور دهید که بر روی محتوای فایل نظارت داشته و هرگاه در فایل SASS تغییر یا بروز رسانی رخ داد، CSS متناظر را نیز بروز آوری کند.

sass --watch C:\ruby\lib\sass\warn.scss:warn.css

پس از اجرای دستور بالا، فایل error.css به صورت اتوماتیک ایجاد می شود. حال هر زمان که فایل SCSS را تغییر می دهید، فایل error.css به صورت خودکار بروز آوری می شود.

خروجی

جهت مشاهده ی خروجی کد، مراحل زیر را به ترتیب طی نمایید.

• کد بالا را در فایل error.scss ذخیره نمایید.
• دستور خط فرمان فوق را در پنجره ی فرمان (cmd) اجرا نمایید.