[Bug]: Error: Cannot find module 'postcss-scss'
firestar300 opened this issue · comments
Milan Ricoul commented
How did you encounter this bug?
On save on a *.scss file, i got this error :
Error: Cannot find module 'postcss-scss'
Require stack: - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-framework/node_modules/stylelint-config-recommended-scss/index.js - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-framework/node_modules/stylelint/node_modules/cosmiconfig/dist/loaders.js - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-framework/node_modules/stylelint/node_modules/cosmiconfig/dist/ExplorerBase.js - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-framework/node_modules/stylelint/node_modules/cosmiconfig/dist/Explorer.js - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-framework/node_modules/stylelint/node_modules/cosmiconfig/dist/index.js - /Projets/beapi/beapi-frontend-framework/web/app/themes/beapi-frontend-fr...
Code Snippet
/**
* Assign inputs
*/
@function assign-inputs($inputs, $pseudo: null) {
$list: ();
@each $input in $inputs {
$input: unquote($input);
$input: if($pseudo, $input + ":" + $pseudo, $input);
$list: append($list, $input, comma);
}
@return $list;
}
Stylelint Configuration
.stylelintrc
{
"extends": [
"stylelint-config-recommended-scss",
"stylelint-config-recess-order"
],
"plugins": [
"stylelint-scss"
],
"customSyntax": "postcss-scss",
"rules": {
"block-closing-brace-empty-line-before": null,
"block-closing-brace-newline-after": null,
"block-closing-brace-newline-before": null,
"block-closing-brace-space-before": null,
"block-opening-brace-newline-after": null,
"block-opening-brace-space-after": null,
"block-opening-brace-space-before": "always",
"declaration-block-semicolon-newline-after": null,
"declaration-block-semicolon-space-after": null,
"declaration-block-semicolon-space-before": null,
"declaration-block-trailing-semicolon": "always",
"indentation": 4,
"no-descending-specificity": null,
"number-leading-zero": "never",
"declaration-colon-newline-after": null,
"max-line-length": 400,
"no-eol-whitespace": [
true,
{
"ignore": [
"empty-lines"
]
}
],
"at-rule-empty-line-before": [
"always",
{
"ignore": [
"inside-block",
"blockless-after-same-name-blockless",
"blockless-after-blockless"
]
}
],
"at-rule-no-unknown": [
true,
{
"ignoreAtRules": [
"extend",
"at-root",
"debug",
"warn",
"error",
"if",
"else",
"for",
"each",
"while",
"mixin",
"include",
"content",
"return",
"function"
]
}
],
"string-quotes": "double"
}
}
package.json
{
"name": "beapi-frontend-framework",
"version": "5.0.0",
"author": "Be API",
"repository": {
"type": "git",
"url": "https://github.com/BeAPI/beapi-frontend-framework"
},
"scripts": {
"start": "node_modules/.bin/webpack --watch --config config/webpack.dev.js",
"build": "node_modules/.bin/webpack --config config/webpack.prod.js",
"bundle-report": "node_modules/.bin/webpack --config config/webpack.prod.js --json=dist/stats.json && node_modules/.bin/webpack-bundle-analyzer dist/stats.json",
"image": "node config/image-sizes.js"
},
"license": "GPL-2.0",
"dependencies": {
"lazysizes": "^5.3.2",
"oneloop.js": "^3.0.0",
"what-input": "^5.2.10"
},
"devDependencies": {
"browser-sync": "^2.26.14",
"browser-sync-webpack-plugin": "^2.3.0",
"canvas": "^2.8.0",
"clean-webpack-plugin": "^4.0.0-alpha.0",
"css-loader": "^5.2.4",
"cssnano": "^5.0.1",
"esbuild-loader": "^2.13.1",
"eslint": "^7.24.0",
"eslint-config-prettier": "^8.2.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint-webpack-plugin": "^2.5.4",
"image-webpack-loader": "^7.0.1",
"js-yaml": "^4.1.0",
"json2csv": "^5.0.6",
"mini-css-extract-plugin": "^1.5.0",
"ora": "^5.4.0",
"portfinder": "^1.0.28",
"postcss": "8.4.14",
"postcss-import": "^14.0.1",
"postcss-loader": "^5.2.0",
"postcss-preset-env": "^6.7.0",
"postcss-pxtorem": "^6.0.0",
"postcss-scss": "^4.0.4",
"postcss-sort-media-queries": "^3.8.9",
"prettier": "^2.2.1",
"sass": "^1.32.11",
"sass-loader": "^11.0.1",
"style-loader": "^2.0.0",
"stylelint": "14.9.0",
"stylelint-config-recess-order": "3.0.0",
"stylelint-config-recommended-scss": "^6.0.0",
"stylelint-config-standard": "^21.0.0",
"stylelint-scss": "^3.19.0",
"stylelint-webpack-plugin": "3.3.0",
"svg-sprite-loader": "^6.0.10",
"svgo-loader": "^3.0.0",
"webpack": "^5.35.0",
"webpack-bundle-analyzer": "^4.4.1",
"webpack-cli": "^4.6.0",
"webpack-manifest-plugin": "^3.1.1",
"webpack-merge": "^5.7.3",
"webpackbar": "^5.0.0-3"
},
"volta": {
"node": "16.15.0"
}
}
Extension Configuration
{
"workbench.colorTheme": "One Dark Pro Flat",
"editor.wordWrap": "on",
"editor.fontSize": 12,
"editor.tabSize": 4,
"editor.quickSuggestions": {
"other": true,
"comments": true,
"strings": true
},
"editor.snippetSuggestions": "top",
"editor.renderWhitespace": "all",
"editor.minimap.enabled": true,
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": "active",
"eslint.format.enable": true,
"eslint.workingDirectories": [
{
"mode": "auto"
}
],
"css.validate": false,
"less.validate": false,
"scss.validate": false,
"[javascript]": {
"editor.tabSize": 2,
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[scss]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[php]": {
"editor.defaultFormatter": "wongjn.php-sniffer",
},
"phpcbf.enable": true,
"phpcbf.executablePath": "./vendor/bin/phpcs",
"phpcbf.documentFormattingProvider": true,
"phpcbf.onsave": true,
"phpcbf.standard": "./phpcs.xml.dist",
"phpSniffer.autoDetect": true,
"sync.gist": "",
"editor.largeFileOptimizations": false,
"javascript.updateImportsOnFileMove.enabled": "always",
"stylelint.enable": true,
"stylelint.customSyntax": "postcss-scss",
"stylelint.validate": [
"css",
"scss",
"postcss"
],
"search.useGlobalIgnoreFiles": true,
"editor.inlineSuggest.enabled": true
}
Actual Behaviour
In Webpack, I got expected error :
src/scss/02-tools/_f-assign-inputs.scss
9:17 ✖ Unquote function used with an scss/function-unquote-no-unquoted-strings-inside
already-unquoted string
9:17 ✖ Expected string.unquote instead of unquote scss/no-global-function-names
11:16 ✖ Expected list.append instead of append scss/no-global-function-names
But in VSCode I got the missing module error message.
Expected Behaviour
On save, it should autofix the stylelint issues in the file.
Logs
No response
Stylelint Version
14.9.0
vscode-stylelint Version
1.2.2
Node.js Version
v16.15.0
Operating System
macOS 12.2.1
Windows Subsystem for Linux
No response
Code of Conduct
- I agree to follow vscode-stylelint's Code of Conduct
Milan Ricoul commented
It works after restarting VSCode.