Skip to content

Rule Proposal: vue/enforce-style-attribute #2109

Closed
@mussinbenarbia

Description

@mussinbenarbia

Please describe what the rule should do:

Many projects agree on using one specific way of writing CSS. For example, using CSS Modules, strictly using Scoped CSS, or a combination of the two, which may be rare but could happen when migrating from one style to another.

This rule helps developers enforce one or either of the two attributes in SFCs.

What category should the rule belong to?

[x] Enforces code style (layout)
[ ] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

Option either: No warning as long as one attribute is specified. Does not enforce one specific style.

<!-- ✓ GOOD -->
<style scoped></style>
<style lang="scss" src="../path/to/style.scss" scoped></style>

<!-- ✓ GOOD -->
<style module></style>

<!-- ✗ BAD -->
<style></style>

Option scoped: Style tags must have the scoped attribute.

<!-- ✓ GOOD -->
<style scoped></style>
<style lang="scss" src="../path/to/style.scss" scoped></style>

<!-- ✗ BAD -->
<style module></style>
<style></style>

Option module: Style tags must have the module attribute.

<!-- ✓ GOOD -->
<style module></style>


<!-- ✗ BAD -->
<style scoped></style>
<style lang="scss" src="../path/to/style.scss" scoped></style>
<style></style>

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions