Gathering detailed insights and metrics for eslint-plugin-vue-scoped-css
Gathering detailed insights and metrics for eslint-plugin-vue-scoped-css
ESLint plugin for Scoped CSS in Vue.js
Installations
npm install eslint-plugin-vue-scoped-cssDeveloper Guide
BETA
Typescript
Yes
Module System
CommonJS
Min. Node Version
^12.22 || ^14.17 || >=16
Node Version
20.19.1
NPM Version
10.8.2
Score
89.9
Supply Chain
92.9
Quality
80.3
Maintenance
100
Vulnerability
96.4
License
Releases
33
Languages
3
TypeScript
Vue
JavaScript
TypeScript (89.4%)
Vue (9.63%)
JavaScript (0.97%)
Developer
Download Statistics
Total Downloads
8,962,244
Last Day
1,889
Last Week
68,253
Last Month
327,524
Last Year
3,553,657
GitHub Statistics
MIT License
107 Stars
387 Commits
12 Forks
2 Watchers
9 Branches
9 Contributors
Updated on May 21, 2025
Bundle Size
631.25 kB
Minified
179.84 kB
Minified + Gzipped
Sponsor this package
Maintainers
1
Package Meta Information
Latest Version
2.10.0
Package Id
eslint-plugin-vue-scoped-css@2.10.0
Unpacked Size
302.18 kB
Size
52.57 kB
File Count
151
NPM Version
10.8.2
Node Version
20.19.1
Published on
May 21, 2025
Total Downloads
Cumulative downloads
Total Downloads
8,962,244
Dependencies
8
Peer Dependencies
2
Dev Dependencies
46
@changesets/cli@eslint-community/eslint-plugin-eslint-comments@ota-meshi/eslint-plugin@ota-meshi/site-kit-eslint-editor-vue@svitejs/changesets-changelog-github-compact@types/eslint@types/estree@types/lodash@types/mocha@types/node@types/semver@typescript-eslint/eslint-plugin@typescript-eslint/parserassertcross-enveslinteslint-config-prettiereslint-plugin-eslint-plugineslint-plugin-jsdoceslint-plugin-json-schema-validatoreslint-plugin-jsonceslint-plugin-neslint-plugin-node-dependencieseslint-plugin-prettiereslint-plugin-regexpeslint-plugin-vueeslint-plugin-vue-scoped-csseslint-plugin-ymleventsmochanycpakoprettierrimrafsemverstylelintstylelint-config-recommended-vuestylelint-config-standardstylelint-config-standard-vuestylelint-stylusts-nodetypescripttypescript-eslintvite-plugin-eslint4bvitepressvue-eslint-parser
eslint-plugin-vue-scoped-css
eslint-plugin-vue-scoped-css is ESLint plugin for Scoped CSS in Vue.js.
Features
This ESLint plugin provides linting rules relate to better ways to help you avoid problems when using Scoped CSS in Vue.js.
- Provides linting rules for Scoped CSS.
- Supports CSS syntax including level 4 selectors.
- Supports
<style lang="scss">. - Supports
<style lang="stylus">. - Parses
<style>,<template>and<script>blocks.
You can check on the Online DEMO.
Documentation
See documents.
Installation
1npm install --save-dev eslint eslint-plugin-vue-scoped-css vue-eslint-parser
Requirements
- ESLint v6.0.0 and above
- Node.js v12.22.x, v14.17.x, v16.x and above
Usage
New Config (eslint.config.js)
Use eslint.config.js file to configure rules. See also: https://eslint.org/docs/latest/use/configure/configuration-files-new.
Example eslint.config.js:
1import eslintPluginVueScopedCSS from 'eslint-plugin-vue-scoped-css'; 2export default [ 3 // add more generic rule sets here, such as: 4 // js.configs.recommended, 5 ...eslintPluginVueScopedCSS.configs['flat/recommended'], 6 { 7 rules: { 8 // override/add rules settings here, such as: 9 // 'vue-scoped-css/no-unused-selector': 'error' 10 } 11 } 12];
Legacy Config (.eslintrc)
Use .eslintrc.* file to configure rules. See also: https://eslint.org/docs/latest/use/configure/.
Example .eslintrc.js:
1module.exports = { 2 extends: [ 3 // add more generic rulesets here, such as: 4 // 'eslint:recommended', 5 'plugin:vue-scoped-css/vue3-recommended' 6 ], 7 rules: { 8 // override/add rules settings here, such as: 9 // 'vue-scoped-css/no-unused-selector': 'error' 10 } 11}
Configs
This plugin provides some predefined configs:
New Config (eslint.config.js)
*.configs['flat/base']- Settings and rules to enable this plugin*.configs['flat/recommended']-/base, plus rules for better ways to help you avoid problems for Vue.js 3.x*.configs['flat/vue2-recommended']-/base, plus rules for better ways to help you avoid problems for Vue.js 2.x*.configs['flat/all']- All rules of this plugin are included
Legacy Config (.eslintrc)
plugin:vue-scoped-css/base- Settings and rules to enable this pluginplugin:vue-scoped-css/recommended-/base, plus rules for better ways to help you avoid problems for Vue.js 2.xplugin:vue-scoped-css/vue3-recommended-/base, plus rules for better ways to help you avoid problems for Vue.js 3.xplugin:vue-scoped-css/all- All rules of this plugin are included
Rules
The --fix option on the command line automatically fixes problems reported by rules which have a wrench :wrench: below.
Recommended for Vue.js 3.x
Enforce all the rules in this category with:
1export default [ 2 ...eslintPluginVueScopedCSS.configs['flat/recommended'], 3]
or
1{ 2 "extends": ["plugin:vue-scoped-css/vue3-recommended"] 3}
| Rule ID | Description | |
|---|---|---|
| vue-scoped-css/enforce-style-type | enforce the <style> tags to be plain or have the scoped or module attribute | |
| vue-scoped-css/no-deprecated-deep-combinator | disallow using deprecated deep combinators | :wrench: |
| vue-scoped-css/no-parent-of-v-global | disallow parent selector for ::v-global pseudo-element | |
| vue-scoped-css/no-parsing-error | disallow parsing errors in <style> | |
| vue-scoped-css/no-unused-keyframes | disallow @keyframes which don't use in Scoped CSS | |
| vue-scoped-css/no-unused-selector | disallow selectors defined in Scoped CSS that don't use in <template> | |
| vue-scoped-css/require-v-deep-argument | require selector argument to be passed to ::v-deep() | :wrench: |
| vue-scoped-css/require-v-global-argument | require selector argument to be passed to ::v-global() | |
| vue-scoped-css/require-v-slotted-argument | require selector argument to be passed to ::v-slotted() |
Recommended for Vue.js 2.x
Enforce all the rules in this category with:
1export default [ 2 ...eslintPluginVueScopedCSS.configs['flat/vue2-recommended'], 3]
or
1{ 2 "extends": ["plugin:vue-scoped-css/recommended"] 3}
| Rule ID | Description | |
|---|---|---|
| vue-scoped-css/enforce-style-type | enforce the <style> tags to be plain or have the scoped or module attribute | |
| vue-scoped-css/no-parsing-error | disallow parsing errors in <style> | |
| vue-scoped-css/no-unused-keyframes | disallow @keyframes which don't use in Scoped CSS | |
| vue-scoped-css/no-unused-selector | disallow selectors defined in Scoped CSS that don't use in <template> |
Uncategorized
No preset enables the rules in this category. Please enable each rule if you want.
For example:
1{ 2 "rules": { 3 "vue-scoped-css/no-deprecated-v-enter-v-leave-class": "error" 4 } 5}
| Rule ID | Description | |
|---|---|---|
| vue-scoped-css/no-deprecated-v-enter-v-leave-class | disallow v-enter and v-leave classes. | |
| vue-scoped-css/require-selector-used-inside | disallow selectors defined that is not used inside <template> | |
| vue-scoped-css/v-deep-pseudo-style | enforce :deep()/::v-deep() style | :wrench: |
| vue-scoped-css/v-global-pseudo-style | enforce :global()/::v-global() style | :wrench: |
| vue-scoped-css/v-slotted-pseudo-style | enforce :slotted()/::v-slotted() style | :wrench: |
Deprecated
- :warning: We're going to remove deprecated rules in the next major release. Please migrate to successor/new rules.
- :innocent: We don't fix bugs which are in deprecated rules since we don't have enough resources.
| Rule ID | Replaced by |
|---|---|
| vue-scoped-css/require-scoped | vue-scoped-css/enforce-style-type |
Contributing
Welcome contributing!
Please use GitHub's Issues/PRs.
Development Tools
npm testruns tests and measures coverage.npm run updateruns in order to update readme and recommended configuration.
License
See the LICENSE file for license rights and limitations (MIT).
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
5 commit(s) and 1 issue activity found in the last 90 days -- score normalized to 5
Reason
Found 3/24 approved changesets -- score normalized to 1
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Info: topLevel 'contents' permission set to 'read': .github/workflows/GHPages.yml:10
- Warn: no topLevel permission defined: .github/workflows/NodeCI.yml:1
- Warn: no topLevel permission defined: .github/workflows/Release.yml:1
- Warn: no topLevel permission defined: .github/workflows/format.yml:1
- Info: no jobLevel write permissions found
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/GHPages.yml:27: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/GHPages.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/GHPages.yml:28: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/GHPages.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/GHPages.yml:34: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/GHPages.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/GHPages.yml:36: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/GHPages.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/GHPages.yml:41: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/GHPages.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:78: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:80: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:93: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:94: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:102: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:13: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:27: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:42: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:44: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:60: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/NodeCI.yml:62: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/NodeCI.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/Release.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/Release.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/Release.yml:20: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/Release.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/Release.yml:27: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/Release.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/format.yml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/format.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/format.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/format.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/stale.yml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/future-architect/eslint-plugin-vue-scoped-css/stale.yml/master?enable=pin
- Warn: npmCommand not pinned by hash: .github/workflows/GHPages.yml:31
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:67
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:69
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:85
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:87
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:97
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:101
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:17
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:32
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:49
- Warn: npmCommand not pinned by hash: .github/workflows/NodeCI.yml:51
- Warn: npmCommand not pinned by hash: .github/workflows/Release.yml:24
- Warn: npmCommand not pinned by hash: .github/workflows/format.yml:17
- Info: 0 out of 22 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 2 third-party GitHubAction dependencies pinned
- Info: 0 out of 13 npmCommand dependencies pinned
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 29 are checked with a SAST tool
Reason
13 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-67mh-4wv8-2f99
- Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-64vr-g452-qvp3
- Warn: Project is vulnerable to: GHSA-9cwx-2883-4wfx
- Warn: Project is vulnerable to: GHSA-vg6x-rcgg-rjx6
- Warn: Project is vulnerable to: GHSA-x574-m823-4x7w
- Warn: Project is vulnerable to: GHSA-4r4m-qw57-chr8
- Warn: Project is vulnerable to: GHSA-xcj6-pq6g-qj4x
- Warn: Project is vulnerable to: GHSA-356w-63v5-8wf4
- Warn: Project is vulnerable to: GHSA-859w-5945-r5v3
Score
3.4
/10
Last Scanned on 2025-06-02
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More