eslint-plugin-vue-scoped-css 2.12.0 → 3.1.0

package/README.md

@@ -39,10 +39,15 @@ See [documents](https://future-architect.github.io/eslint-plugin-vue-scoped-css/
 npm install --save-dev eslint eslint-plugin-vue-scoped-css vue-eslint-parser
 ```
 
+If you use SCSS or STYLUS in your project, you also need to run:
+
+* SCSS: `npm install --save-dev postcss-scss`
+* Stylus: `npm install --save-dev postcss-styl`
+
 > **Requirements**
 >
-> - ESLint v6.0.0 and above
-> - Node.js v12.22.x, v14.17.x, v16.x and above
+> - ESLint v9.38.0 and above
+> - Node.js v20.19.x, v22.13.x, v24.x and above
 
 <!--DOCS_IGNORE_END-->
 
@@ -62,7 +67,7 @@ import eslintPluginVueScopedCSS from 'eslint-plugin-vue-scoped-css';
 export default [
   // add more generic rule sets here, such as:
   // js.configs.recommended,
-  ...eslintPluginVueScopedCSS.configs['flat/recommended'],
+  ...eslintPluginVueScopedCSS.configs['recommended'],
   {
     rules: {
       // override/add rules settings here, such as:
@@ -72,43 +77,23 @@ export default [
 ];
 ```
 
-### Legacy Config (`.eslintrc`)
-
-Use `.eslintrc.*` file to configure rules. See also: <https://eslint.org/docs/latest/use/configure/>.
-
-Example **.eslintrc.js**:
-
-```js
-module.exports = {
-  extends: [
-    // add more generic rulesets here, such as:
-    // 'eslint:recommended',
-    'plugin:vue-scoped-css/vue3-recommended'
-  ],
-  rules: {
-    // override/add rules settings here, such as:
-    // 'vue-scoped-css/no-unused-selector': 'error'
-  }
-}
-```
-
 ## Configs
 
 This plugin provides some predefined configs:
 
-### New Config (`eslint.config.js`)
+- `*.configs['base']` - Settings and rules to enable this plugin
+- `*.configs['recommended']` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 3.x
+- `*.configs['vue2-recommended']` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 2.x
+- `*.configs['all']` - All rules of this plugin are included
 
-- `*.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
+### Backward-compatible aliases
 
-### Legacy Config (`.eslintrc`)
+The following `flat/*` aliases are kept for backward compatibility:
 
-- `plugin:vue-scoped-css/base` - Settings and rules to enable this plugin
-- `plugin:vue-scoped-css/recommended` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 2.x
-- `plugin:vue-scoped-css/vue3-recommended` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 3.x
-- `plugin:vue-scoped-css/all` - All rules of this plugin are included
+- `*.configs['flat/base']` → `*.configs['base']`
+- `*.configs['flat/recommended']` → `*.configs['recommended']`
+- `*.configs['flat/vue2-recommended']` → `*.configs['vue2-recommended']`
+- `*.configs['flat/all']` → `*.configs['all']`
 
 <!--USAGE_GUIDE_END-->
 <!--USAGE_SECTION_END-->
@@ -127,18 +112,10 @@ Enforce all the rules in this category with:
 
 ```js
 export default [
-  ...eslintPluginVueScopedCSS.configs['flat/recommended'],
+  ...eslintPluginVueScopedCSS.configs['recommended'],
 ]
 ```
 
-or
-
-```json
-{
-  "extends": ["plugin:vue-scoped-css/vue3-recommended"]
-}
-```
-
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [vue-scoped-css/enforce-style-type](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/enforce-style-type.html) | enforce the `<style>` tags to be plain or have the `scoped` or `module` attribute |  |
@@ -150,6 +127,9 @@ or
 | [vue-scoped-css/require-v-deep-argument](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/require-v-deep-argument.html) | require selector argument to be passed to `::v-deep()` | :wrench: |
 | [vue-scoped-css/require-v-global-argument](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/require-v-global-argument.html) | require selector argument to be passed to `::v-global()` |  |
 | [vue-scoped-css/require-v-slotted-argument](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/require-v-slotted-argument.html) | require selector argument to be passed to `::v-slotted()` |  |
+| [vue-scoped-css/v-deep-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-deep-pseudo-style.html) | enforce `:deep()`/`::v-deep()` style | :wrench: |
+| [vue-scoped-css/v-global-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-global-pseudo-style.html) | enforce `:global()`/`::v-global()` style | :wrench: |
+| [vue-scoped-css/v-slotted-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-slotted-pseudo-style.html) | enforce `:slotted()`/`::v-slotted()` style | :wrench: |
 
 ## Recommended for Vue.js 2.x
 
@@ -157,18 +137,10 @@ Enforce all the rules in this category with:
 
 ```js
 export default [
-  ...eslintPluginVueScopedCSS.configs['flat/vue2-recommended'],
+  ...eslintPluginVueScopedCSS.configs['vue2-recommended'],
 ]
 ```
 
-or
-
-```json
-{
-  "extends": ["plugin:vue-scoped-css/recommended"]
-}
-```
-
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [vue-scoped-css/enforce-style-type](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/enforce-style-type.html) | enforce the `<style>` tags to be plain or have the `scoped` or `module` attribute |  |
@@ -195,9 +167,6 @@ For example:
 |:--------|:------------|:---|
 | [vue-scoped-css/no-deprecated-v-enter-v-leave-class](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/no-deprecated-v-enter-v-leave-class.html) | disallow v-enter and v-leave classes. |  |
 | [vue-scoped-css/require-selector-used-inside](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/require-selector-used-inside.html) | disallow selectors defined that is not used inside `<template>` |  |
-| [vue-scoped-css/v-deep-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-deep-pseudo-style.html) | enforce `:deep()`/`::v-deep()` style | :wrench: |
-| [vue-scoped-css/v-global-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-global-pseudo-style.html) | enforce `:global()`/`::v-global()` style | :wrench: |
-| [vue-scoped-css/v-slotted-pseudo-style](https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/v-slotted-pseudo-style.html) | enforce `:slotted()`/`::v-slotted()` style | :wrench: |
 
 ## Deprecated