Closed
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.48.0
What version of eslint-plugin-svelte
are you using?
2.33.0
What did you do?
Configuration
module.exports = {
root: true,
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:svelte/recommended',
'plugin:svelte/prettier',
'prettier'
],
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
ignorePatterns: ['*.cjs', '/src-tauri/target', '*.config*', '/build', '*.json'],
overrides: [
{
files: ['*.svelte'],
parser: 'svelte-eslint-parser',
// Parse the `<script>` in `.svelte` as TypeScript by adding the following configuration.
parserOptions: {
parser: '@typescript-eslint/parser'
}
}
],
parserOptions: {
sourceType: 'module',
ecmaVersion: 2020,
project: 'tsconfig.json',
extraFileExtensions: ['.svelte']
},
env: {
browser: true,
es2017: true,
node: true
}
};
Eslint complains when using global styles with <style global>
(Unused CSS selector "input"(css-unused-selector) (svelte/valid-compile))
<style global>
input {
@apply bg-surface-50-900-token h-full overflow-hidden;
}
</style>
Using :global(input)
instead doesn't error, which should be the same.
What did you expect to happen?
No warning/error
What actually happened?
Unused CSS selector "input"(css-unused-selector) (svelte/valid-compile)
Link to GitHub Repo with Minimal Reproducible Example
Additional comments
The previous plugin eslint-plugin-svelte3 had the same issue, but it wasn't fixed (sveltejs/eslint-plugin-svelte3#123)