stylelint-config-standard-scss: Cannot resolve custom syntax module "postcss-scss"

I upgraded my Stylelint config to use Stylelint 14 and switched from stylelint-scss to stylelint-config-standard-scss, but now all the tests for my plugin failed with the following warning.

If I remove stylelint-config-standard-scss then everything works, but I would like to continue supporting sass files in my config.

Any ideas how I can resolve this?

Cannot resolve custom syntax module "postcss-scss". Check that module "postcss-scss" is available and spelled correctly.

at getCustomSyntax (node_modules/stylelint/lib/getPostcssResult.js:97:10)
at getPostcssResult (node_modules/stylelint/lib/getPostcssResult.js:41:5)
at lintSource (node_modules/stylelint/lib/lintSource.js:76:20)
at Function.standalone [as lint] (node_modules/stylelint/lib/standalone.js:132:26)

My PR can be seen here: https://github.com/spaceninja/stylelint-config-spaceninja/pull/171

The failing tests are here: https://github.com/spaceninja/stylelint-config-spaceninja/runs/3970823065?check_suite_focus=true

About this issue

Original URL
State: closed
Created 3 years ago
Reactions: 10
Comments: 22 (8 by maintainers)

Most upvoted comments

Same issue over here while updating to Stylelint 14.

+12

monsieurnebo on Nov 5, 2021

Had the same issue in a yarn workspaces project. As mentioned the problem was caused by a module depending on PostCSS@7. I used yarn why postcss to check and found the following lines:

=> Found "resolve-url-loader#postcss@7.0.36"
info This module exists because "_project_#create-react-app#react-scripts#resolve-url-loader" depends on it.
info Disk size without dependencies: "684KB"
info Disk size with unique dependencies: "1.55MB"
info Disk size with transitive dependencies: "1.67MB"
info Number of shared dependencies: 7

So I added the following to my root package.json:

"resolutions": {
  "postcss": "^8.3.11"
},

After running yarn install again the issue was gone. Stylelint runs with no problem and also my create-react-app workspace still runs without problems.

efoken on Oct 25, 2021

I’ve created PR stylelint/stylelint#5635 to clarify this error. If you install the PR version of Stylelint, you can see the real error:

$ git clone https://github.com/spaceninja/stylelint-config-spaceninja.git
$ cd stylelint-config-spaceninja
$ git switch renovate/stylelint-14.x
$ yarn add --dev github:stylelint/stylelint#better-error-handling-for-module-not-found
$ yarn test
...
TypeError: Class extends value undefined is not a constructor or null
  at Object.<anonymous> (node_modules/postcss-scss/lib/nested-declaration.js:3:33)
  at Object.<anonymous> (node_modules/postcss-scss/lib/scss-parser.js:4:25)
...

You can resolve this error by installing PostCSS 8:

$ yarn add --dev postcss
$ yarn test
...
Test Suites: 1 failed, 1 total
Tests:       2 failed, 7 passed, 9 total
...

ybiquitous on Oct 22, 2021

I’ve opened PR and issue in Stylelint repository.

niksy on Oct 22, 2021

I think this is related to Stylelint core custom syntax handling.

Stylelint tries to resolve custom syntax location (https://github.com/stylelint/stylelint/blob/main/lib/getPostcssResult.js#L95) but uses Node require algorithm, so it search from that file upwards.

If you have dependancy tree where postcss-scss is not in one of the root directories, but is nested inside this config’s node_modules (it happens if you have different versions of same package), path resolution fails.

Easy fix should be to install postcss-scss as your project dependancy so it can be placed inside root node_modules, but configs are meant to be self contained, otherwise we would have situation like long standing ESLint “bug”.

@jeddy3 how can this be resolved? Should require take some context? Or should postcss-scss be peer dependancy?

niksy on Oct 22, 2021