Assume an empty svelte.config.js instead of requiring it?
See original GitHub issueDescribe the bug
I was pointed here after reporting withastro/astro#5065 , the problem seems to be that the VS Code extension requires a svelte.config.js
that isn’t always available, for example when using Sass in a Svelte component in an Astro project, that doesn’t have that file in its root folder.
Reproduction
When using a Svelte component with Sass styling (<style lang="scss">) in an Astro project, I get a warning in VS Code:
Cannot find any of modules: sass,node-sass
Error: Cannot find module 'node-sass'
Require stack:
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-preprocess\dist\modules\utils.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-preprocess\dist\autoProcess.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-preprocess\dist\index.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\dist\src\importPackage.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\dist\src\lib\documents\configLoader.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\dist\src\lib\documents\Document.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\dist\src\lib\documents\index.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\dist\src\server.js
- d:\program\VSCode\data\extensions\svelte.svelte-vscode-106.2.0\node_modules\svelte-language-server\bin\server.js
The file cannot be parsed because style requires a preprocessor that doesn't seem to be setup or failed during setup. Did you setup a `svelte.config.js`? If you use SCSS, it may be necessary to add the path to your NODE runtime to the setting `svelte.language-server.runtime`, or use `sass` instead of `node-sass`.
See https://github.com/sveltejs/language-tools/tree/master/docs#using-with-preprocessors for more info.
The sass
package, is installed, which makes it work, but the warning still persists in VS Code, until I follow the advice and add a very simple svelte.config.js
file to the Astro project, then after restarting VS Code, it’s gone:
svelte.config.js
export default {
preprocess: null
}
Expected behaviour
No problem should be displayed in VS Code.
I’m aware that https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/scss-less.md#2-setting-up-a-svelte-configjs states that “You need a svelte.config.js.” but this is quite hard to enforce in other libraries (there are enough boilerplate files in most web projects anyway), so if no svelte.config.js
exists, could the simplest possible configuration be assumed instead?
export default {
preprocess: null
}
System Info
- OS: Windows 10
- IDE: VSCode 1.72.0 with latest extensions
Which package is the issue about?
Svelte for VS Code extension
Additional Information, eg. Screenshots
No response
Issue Analytics
- State:
- Created a year ago
- Comments:5 (3 by maintainers)
Top GitHub Comments
Yeah. It’s because it’s using the fallback preprocessor shipped with the extension. Because of that node can’t find the sass installed in the workspace. The reason why the language server uses the bundled svelte-preprocess is because of pnpm’s strict dependencies rule. The language server can’t locate the svelte-preprocess used by Astro under the hood. If you manually install svelte-preprocess it should work fine.
This is kind of similar to part of https://github.com/sveltejs/language-tools/issues/1259. So you can read the discussion there. In short, we won’t want bundle
sass
. So If we want to make it more effortless, we might have to add some config to svelte-preprocess to let us load modules from the workspace.I can confirm that installing
svelte-preprocess
and restarting VS Code resolves the issue. That’s good news, since you have to do anpx astro add svelte
to use svelte anyway, so it could include that package in its install script, and things should be fine…? I’ll mention this to the Astro team.