sindresorhus / grunt-sass

Compile Sass to CSS
MIT License
1.01k stars 209 forks source link

More descriptive errors for undefined variables #293

Closed kaanra closed 5 years ago

kaanra commented 6 years ago

Hi, how can I get the error log to be more descriptive to include things like file location and line number?

For example, currently the errors look like:

Running "sass:dist" (sass) task
Fatal error: Undefined variable: "$link-color".

However, ideally I'd like something like:

Running "sass:dist" (sass) task
>> Error: Undefined variable: "$link-color".
>>         on line 145 of ../library/css/scss/imports/abstracts/_variables.scss
>>         from line 12 of ../library/css/scss/imports/_abstracts.scss
>>         from line 9 of ../library/css/scss/admin/login.scss
>> >> $link-hover: darken($link-color, 9%);
>> 
>>    --------------------^
bfredpatrick commented 5 years ago

I'm having the same issue as Moondrop. It seems that earlier version of this task had that functionality. If I switch to 1.0.0 I get the error messages that I'd expect to get.

OndrejVertat commented 5 years ago

Only solution in this moment is to downgrade. Version 2.1.0 is latest which has descriptive and specific error outputs.

liquidvisual commented 5 years ago

3.0.2 also gives me Fatal error: The implementation option must be passed to the Sass task. Rolling back to 2.1.0 fixed that.

badfeather commented 5 years ago

I've fixed this by switching to the Dart Sass implementation. For example, I'm now getting the following output on an error:

Fatal error: expected "}".
   ╷
44 │ }
   │  ^
   ╵
  assets/src/sass/theme/_theme-header.scss 44:2  root stylesheet
  assets/src/sass/theme.scss 43:9                root stylesheet

Note: The documentation for using the Dart Sass implementation could use some improvement. It should state that you should run npm install --save-dev sass fibers grunt-sass to use Dart Sass, and the following should be changed:

const Fiber = require('fibers');
const sass = require('node-sass');

Should be changed to:

const Fiber = require('fibers');
const sass = require('sass');
toptalo commented 5 years ago

If replace grunt.fatal(error); in sass.js to grunt.fatal(error.formatted); then error output will look like

Fatal error: Error: argument `$map` of `map-get($map, $key)` must be a map
        on line 4 of scss/core/_gird.scss, in function `map-get`
        from line 4 of scss/core/_gird.scss, in function `grid-get`
        from line 75 of scss/core/_gird.scss, in mixin `column`
        from line 30 of scss/blocks/_columns.scss, in mixin `@content`
        from line 49 of scss/core/_mixins.scss, in mixin `media`
        from line 29 of scss/blocks/_columns.scss
        from line 33 of scss/clever.scss
>>   @return map-get(map-get($grid, $breakpoint), $key);

   ----------^

I have check it with node-sass and dart sass - both work