How to lint indent based SASS? - sass

Question

I am trying to add linting for SugarSS to my project. I've added lint-staged command to my package.json:
"scripts": {
"lint-staged": "$(yarn bin)/lint-staged"
},
"lint-staged": {
...
"app/assets/styles/**/*.sass": [
"prettier --write",
"stylelint --fix --syntax sugarss",
"git add"
]
}
When I run npm run lint-staged it outputs
✖ prettier --write found some errors. Please fix them and try committing again.
[error] path/to/style.sass: SyntaxError: Unexpected token, expected ";" (3:16)
[error] 1 | h1.question
[error] 2 | overflow: visible
[error] > 3 | padding-right: 12px
[error] | ^
[error] 4 | color: #333
[error] 5 |
[error] 6 | #questions h4
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! my_project#1.0.0 lint-staged: `$(yarn bin)/lint-staged`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the my_project#1.0.0 lint-staged script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Seems like that eslint tries to lint my path/to/style.sass with the new SASS 3 syntax
How can I set up linting for SugarSS syntax in package.json? Thanks

Answer 1

I was able to set up linting for SugarSS with the following setup:
# .stylelintrc
{
"extends": "stylelint-config-sugarss-recommended"
}
And in package.json
{
"devDependencies": {
"stylelint-config-sugarss-recommended": "^1.1.0"
...
},
"scripts": {
"lint-staged": "$(yarn bin)/lint-staged"
},
"lint-staged": {
"app/assets/styles/**/*.sass": [
"stylelint --fix --syntax sugarss",
"git add"
],
...
},
"pre-commit": [
"lint-staged"
]
}