TypeError: Cannot read property 'start' of undefined for Sass for insude Vue

[akoidan]

Clearly describe the bug

The sass loops inside of VUE files cause linter to crash

Which rule, if any, is the bug related to?

not related to any rule

What CSS is needed to reproduce the bug?

Any rule that has @for loop in sass

  $class-slug: for !default

  @for $i from 1 through 4
    .#{$class-slug}-#{$i}
      width: 60px + $i
      color: black

What stylelint configuration is needed to reproduce the bug?

Any rule, is not rule specific. Put something to tigger the linter.

{
  "rules": {
    "color-named": "never"
  }
}

Which version of stylelint are you using?

11.1.1

How are you running stylelint: CLI, PostCSS plugin, Node.js API?

./node_modules/.bin/stylelint Sass.vue

Does the bug relate to non-standard syntax (e.g. SCSS, Less etc.)?

Yes, it's related to SASS loops

What did you expect to happen?

stylelint would work instead of failing with an error

What actually happened (e.g. what warnings or errors did you get)?

An error occured

TypeError: Cannot read property 'start' of undefined
    at LocalFixer.node (/home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:35:27)
    at /home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:41:9
    at /home/andrew/sass-for/node_modules/postcss/lib/container.js:135:18
    at Root.each (/home/andrew/sass-for/node_modules/postcss/lib/container.js:101:16)
    at Root.walk (/home/andrew/sass-for/node_modules/postcss/lib/container.js:131:17)
    at LocalFixer.root (/home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:40:8)
    at LocalFixer.parse (/home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:69:9)
    at parseStyle (/home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:88:39)
    at /home/andrew/sass-for/node_modules/postcss-syntax/parse-style.js:103:17
    at Array.forEach (<anonymous>)

To reproduce the issue:

• git clone https://github.com/akoidan/style-sass-for-issue
• cd style-sass-for-issue
• yarn install
• yarn run works
• yarn run fails

Also here's the demo

[AleshaOleg]

@akoidan sorry, @for is not supported yet 🤷‍♂️
#53

[akoidan]

@akoidan sorry, @for is not supported yet

Any ETA, cause it seems to be for 1.5 years already. Maybe we can ship the package that just skips fors loops? Simple check string.indexof('@for') is already better than nothing

[AleshaOleg]

Released in 0.4.2

[AleshaOleg]

stylelint/stylelint#4408

[akoidan]

@AleshaOleg still doesn't work. The example above provides this error. Please mind the extension is 'vue' not 'sass'

: npm ls |grep postcss-sass
│ ├─┬ postcss-sass@0.4.2

✖ ｢wdm｣: TypeError: Cannot read property 'syntax' of undefined
    at /home/andrew/WebstormProjects/vue-webpack-typescript/src/assets/sass/mixins.sass:27:5
    at Declaration.toString (/home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-syntax/patch-postcss.js:38:67)
    at /home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/stylelint/lib/rules/color-hex-case/index.js:27:50
    at /home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:190:18
    at /home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:135:18
    at Rule.each (/home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:101:16)
    at Rule.walk (/home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:131:17)
    at /home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:148:24
    at Rule.each (/home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:101:16)
    at Rule.walk (/home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:131:17)
    at /home/andrew/WebstormProjects/vue-webpack-typescript/node_modules/postcss-sass/node_modules/postcss/lib/container.js:148:24

: cat ./node_modules/postcss-sass/package.json  |grep version
  "version": "0.4.2",

[AleshaOleg]

Probably an extension might be an issue, unfortunately.
Error on this line - https://github.com/gucong3000/postcss-syntax/blob/master/patch-postcss.js#L38.

Hello, @gucong3000. Can you please help us to figure out, what's wrong here? And how we can skip unsupported rules? Thanks!

[AleshaOleg]

@alpaca-tc did you already try new version somewhere? Is it working for you?

[akoidan]

@AleshaOleg seems like @for works now with freshly-released stylelint:12.0.0. Needs more testing though... Example is here