feat(no-unknown-classes): detect classes from Svelte style blocks - #376
Draft
iainlane wants to merge 1 commit into
Draft
feat(no-unknown-classes): detect classes from Svelte style blocks#376iainlane wants to merge 1 commit into
iainlane wants to merge 1 commit into
Conversation
iainlane
force-pushed
the
iainlane/detect-svelte-classes
branch
from
May 4, 2026 13:12
a0b002f to
6041474
Compare
Svelte components routinely mix Tailwind utility classes with local
component classes declared in the file's `<style>` block. When such a
component is linted with `no-unknown-classes`, every local class is
flagged as unknown because the rule only knows about Tailwind classes -
it has no visibility into the component's scoped styles.
Add an opt-in `detectSvelteStyleClasses` option. When enabled, the rule
treats every class selector declared in the component's `<style>` block
as known for that file. Style blocks that use an unsupported language or
contain malformed CSS silently fall back to detecting nothing, leaving
the rule's existing behaviour unchanged for those files.
Previously,
```svelte
<style>
.card {
border-radius: 0.5rem;
}
</style>
<div class="card flex" />
```
would have failed with `Unknown class detected: card`. After this
change, with `detectSvelteStyleClasses: true`, it passes.
iainlane
force-pushed
the
iainlane/detect-svelte-classes
branch
from
May 4, 2026 13:12
6041474 to
b14c1b9
Compare
|
We need this for vue as well (or we would have to do some ignore acrobatics). |
|
@schoero I would be happy to help with the implementation if you agree with this attempt |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Svelte components routinely mix Tailwind utility classes with local component classes declared in the file's
<style>block. When such a component is linted withno-unknown-classes, every local class is flagged as unknown because the rule only knows about Tailwind classes - it has no visibility into the component's scoped styles.Add an opt-in
detectSvelteStyleClassesoption. When enabled, the rule treats every class selector declared in the component's<style>block as known for that file. Style blocks that use an unsupported language or contain malformed CSS silently fall back to detecting nothing, leaving the rule's existing behaviour unchanged for those files.Previously,
would have failed with
Unknown class detected: card. After this change, withdetectSvelteStyleClasses: true, it passes.