Description
Before You File a Bug Report Please Confirm You Have Done The Following...
- I have tried restarting my IDE and the issue persists.
- I have updated to the latest version of the packages.
What version of ESLint are you using?
8.24.0
What version of eslint-plugin-svelte are you using?
2.8.0
What did you do?
This is a very peculiar bug, but I'm pretty confident it is a bug.
.eslintrc.json:
{
"root": true,
"extends": [
"eslint:recommended",
"plugin:svelte/recommended"
],
"env": {
"browser": true,
"node": true,
"es2017": true
},
"rules": {
"quotes": ["error", "single"],
"svelte/indent": ["error", { "indent": "tab" }]
}
}MyComp.svelte:
<script>
let foo = "bar";
</script>
<p>
<span>Hi</span>
</p>
<style lang="scss" global>
body {
&:hover {
opacity: 0.1;
}
}
</style>What did you expect to happen?
It should report the linting errors in the markup and script sections, as you would expect.
What actually happened?
After running npx eslint src/lib/MyComp.svelte, I get the following output:
/home/arad/other/eslint-plugin-svelte-bug/src/lib/MyComp.svelte
15:3 error Parsing error: Identifier is expected
✖ 1 problem (1 error, 0 warnings)
This is also what appears in the VS Code editor.
The problem seems to be somehow related to the global attribute on the <style> tag, even when I put a space in front of it, it seems like it starts to work as expected, which is really strange:
Link to Minimal Reproducible Example
https://github.com/aradalvand/eslint-plugin-svelte-bug
(I am in Iran where the government has limited Internet access severely so I'm struggling to actually push the repo, you can still reproduce this by creating a new SvelteKit project (npm create svelte@latest) and then adding the two files I provided above, that's it.)
Additional comments
No response