Revert "docs: update readme" (#1499)

Author: ota-meshi

README.md

@@ -32,33 +32,14 @@
 
 `eslint-plugin-svelte` is the official [ESLint](https://eslint.org/) plugin for [Svelte](https://svelte.dev/).\
 It leverages the AST generated by [svelte-eslint-parser](https://github.com/sveltejs/svelte-eslint-parser) to provide custom linting for Svelte.\
-
-> [!NOTE]
->
-> `eslint-plugin-svelte` and `svelte-eslint-parser` cannot be used alongside [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3).
+Note that `eslint-plugin-svelte` and `svelte-eslint-parser` cannot be used alongside [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3).
 
 <!--USAGE_SECTION_START-->
 <!--USAGE_GUIDE_START-->
 
 ## Installation
 
-### CLI
-
-The recommended way to get started is to use the CLI.
-
-```sh
-# new project
-npx sv create
-
-# existing project
-npx sv add eslint
-```
-
-See the [CLI docs](https://svelte.dev/docs/cli/eslint) for more details.
-
-### Manual Setup
-
-```sh
+```bash
 npm install --save-dev svelte eslint eslint-plugin-svelte globals
 ```
 
@@ -71,48 +52,42 @@ npm install --save-dev svelte eslint eslint-plugin-svelte globals
 
 ## Usage
 
-Use `eslint.config.js` to configure rules. See [ESLint documentation](https://eslint.org/docs/latest/use/configure/configuration-files-new) for more details.
+Use the `eslint.config.js` file to configure rules. For more details, see the [ESLint documentation](https://eslint.org/docs/latest/use/configure/configuration-files-new).
 
 ### Configuration
 
 #### JavaScript project
 
 ```js
 // eslint.config.js
-import svelteConfig from './svelte.config.js';
-import { defineConfig } from 'eslint/config';
-import globals from 'globals';
 import js from '@eslint/js';
 import svelte from 'eslint-plugin-svelte';
+import globals from 'globals';
+import svelteConfig from './svelte.config.js';
 
-export default defineConfig([
-  // ...
+/** @type {import('eslint').Linter.Config[]} */
+export default [
   js.configs.recommended,
-  svelte.configs.recommended,
+  ...svelte.configs.recommended,
   {
     languageOptions: {
       globals: {
         ...globals.browser,
-        // for Sveltekit in non-SPA mode
-        ...globals.node
+        ...globals.node // Add this if you are using SvelteKit in non-SPA mode
       }
     }
   },
   {
     files: ['**/*.svelte', '**/*.svelte.js'],
     languageOptions: {
       parserOptions: {
-        // explicitly importing allows for better compatibilty and functionality with rules and other tooling that depend on the config file.
+        // We recommend importing and specifying svelte.config.js.
+        // By doing so, some rules in eslint-plugin-svelte will automatically read the configuration and adjust their behavior accordingly.
+        // While certain Svelte settings may be statically loaded from svelte.config.js even if you don’t specify it,
+        // explicitly specifying it ensures better compatibility and functionality.
         //
-        // Note: `eslint --cache` will fail with non-serializable properties.
-        // In those cases, please remove the non-serializable properties.
-        // svelteConfig: {
-        //   ...svelteConfig,
-        //   kit: {
-        //     ...svelteConfig.kit,
-        //     typescript: undefined
-        //   }
-        // }
+        // If non-serializable properties are included, running ESLint with the --cache flag will fail.
+        // In that case, please remove the non-serializable properties. (e.g. `svelteConfig: { ...svelteConfig, kit: { ...svelteConfig.kit, typescript: undefined }}`)
         svelteConfig
       }
     }
@@ -123,7 +98,7 @@ export default defineConfig([
       // 'svelte/rule-name': 'error'
     }
   }
-]);
+];
 ```
 
 #### TypeScript project
@@ -134,55 +109,46 @@ npm install --save-dev typescript-eslint
 
 ```js
 // eslint.config.js
-import svelteConfig from './svelte.config.js';
-import { defineConfig } from 'eslint/config';
-import globals from 'globals';
 import js from '@eslint/js';
-import ts from 'typescript-eslint';
 import svelte from 'eslint-plugin-svelte';
+import globals from 'globals';
+import ts from 'typescript-eslint';
+import svelteConfig from './svelte.config.js';
 
-export default defineConfig(
+export default ts.config(
   js.configs.recommended,
-  ts.configs.recommended,
-  svelte.configs.recommended,
+  ...ts.configs.recommended,
+  ...svelte.configs.recommended,
   {
     languageOptions: {
       globals: {
         ...globals.browser,
-        // for Sveltekit in non-SPA mode
         ...globals.node
       }
     }
-    // ...
   },
   {
     files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
     // See more details at: https://typescript-eslint.io/packages/parser/
     languageOptions: {
       parserOptions: {
         projectService: true,
-        // Enable typescript parsing for `.svelte` files.
-        extraFileExtensions: ['.svelte'],
-
+        extraFileExtensions: ['.svelte'], // Add support for additional file extensions, such as .svelte
+        parser: ts.parser,
         // Specify a parser for each language, if needed:
         // parser: {
         //   ts: ts.parser,
+        //   js: espree,    // Use espree for .js files (add: import espree from 'espree')
         //   typescript: ts.parser
-        //   js: espree,            // add `import espree from 'espree'`
         // },
-        parser: ts.parser,
 
-        // explicitly importing allows for better compatibilty and functionality with rules and other tooling that depend on the config file.
+        // We recommend importing and specifying svelte.config.js.
+        // By doing so, some rules in eslint-plugin-svelte will automatically read the configuration and adjust their behavior accordingly.
+        // While certain Svelte settings may be statically loaded from svelte.config.js even if you don’t specify it,
+        // explicitly specifying it ensures better compatibility and functionality.
         //
-        // Note: `eslint --cache` will fail with non-serializable properties.
-        // In those cases, please remove the non-serializable properties.
-        // svelteConfig: {
-        //   ...svelteConfig,
-        //   kit: {
-        //     ...svelteConfig.kit,
-        //     typescript: undefined
-        //   }
-        // }
+        // If non-serializable properties are included, running ESLint with the --cache flag will fail.
+        // In that case, please remove the non-serializable properties. (e.g. `svelteConfig: { ...svelteConfig, kit: { ...svelteConfig.kit, typescript: undefined }}`)
         svelteConfig
       }
     }
@@ -205,10 +171,10 @@ export default defineConfig(
 
 This plugin provides the following configurations:
 
-- **`svelte.configs.base`** - Enables correct Svelte parsing. What does this include exactly?
-- **`svelte.configs.recommended`** - Extends the `base` config with additional rules for Svelte best practices.
-- **`svelte.configs.prettier`** - Disables rules that may conflict with [Prettier](https://prettier.io/). You still need to configure Prettier to work with Svelte, for example, by using [prettier-plugin-svelte](https://github.com/sveltejs/prettier-plugin-svelte).
-- **`svelte.configs.all`** - **Not Recommended** - Includes all available rules. Subject to change with every major and minor release. Use at your own risk.
+- **`eslintPluginSvelte.configs.base`** ... Enables correct Svelte parsing.
+- **`eslintPluginSvelte.configs.recommended`** ... Includes `base` configuration, plus rules to prevent errors or unintended behavior.
+- **`eslintPluginSvelte.configs.prettier`** ... Disables rules that may conflict with [Prettier](https://prettier.io/). You still need to configure Prettier to work with Svelte manually, for example, by using [prettier-plugin-svelte](https://github.com/sveltejs/prettier-plugin-svelte).
+- **`eslintPluginSvelte.configs.all`** ... Includes all available rules. **Note:** This configuration is not recommended for production use, as it changes with every minor and major version of `eslint-plugin-svelte`. Use at your own risk.
 
 For more details, see [the rule list](https://sveltejs.github.io/eslint-plugin-svelte/rules/) to explore the rules provided by this plugin.
 
@@ -218,7 +184,7 @@ You can customize the behavior of this plugin using specific settings.
 
 ```js
 // eslint.config.js
-export default defineConfig([
+export default [
   // ...
   {
     settings: {
@@ -229,10 +195,9 @@ export default defineConfig([
           '@typescript-eslint/no-unsafe-assignment',
           '@typescript-eslint/no-unsafe-member-access'
         ],
-
         // Specifies options for Svelte compilation.
         // This affects rules that rely on Svelte compilation,
-        // such as `svelte/valid-compile` and `svelte/no-unused-svelte-ignore`.
+        // such as svelte/valid-compile and svelte/no-unused-svelte-ignore.
         // Note that this setting does not impact ESLint’s custom parser.
         compileOptions: {
           // Specifies options related to PostCSS. You can disable the PostCSS processing by setting it to false.
@@ -241,7 +206,6 @@ export default defineConfig([
             configFilePath: './path/to/my/postcss.config.js'
           }
         },
-
         // Even if settings.svelte.kit is not specified, the rules will attempt to load information from svelte.config.js.
         // However, if the default behavior does not work as expected, you should specify settings.svelte.kit explicitly.
         // If you are using SvelteKit with a non-default configuration, you need to set the following options.
@@ -256,7 +220,7 @@ export default defineConfig([
     }
   }
   // ...
-]);
+];
 ```
 
 ## Editor Integrations
@@ -265,12 +229,18 @@ export default defineConfig([
 Install [dbaeumer.vscode-eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint).\
 Configure `.svelte` files in `.vscode/settings.json`:
 
+```json
+{
+  "eslint.validate": ["javascript", "javascriptreact", "svelte"]
+}
+```
+
 <!--USAGE_GUIDE_END-->
 <!--USAGE_SECTION_END-->
 
 ## Migration Guide
 
-If you’re migrating from `eslint-plugin-svelte@1` or [`@ota-meshi/eslint-plugin-svelte`](https://www.npmjs.com/package/@ota-meshi/eslint-plugin-svelte), see the [migration guide](https://sveltejs.github.io/eslint-plugin-svelte/migration/).
+If you’re migrating from `eslint-plugin-svelte` v1 or [`@ota-meshi/eslint-plugin-svelte`](https://www.npmjs.com/package/@ota-meshi/eslint-plugin-svelte), see the [migration guide](https://sveltejs.github.io/eslint-plugin-svelte/migration/).
 
 ## Versioning Policy
 

docs/README.md

@@ -6,16 +6,13 @@ title: 'eslint-plugin-svelte'
 
 `eslint-plugin-svelte` is the official [ESLint](https://eslint.org/) plugin for [Svelte](https://svelte.dev/).\
 It leverages the AST generated by [svelte-eslint-parser](https://github.com/sveltejs/svelte-eslint-parser) to provide custom linting for Svelte.\
-
-> [!NOTE]
->
-> `eslint-plugin-svelte` and `svelte-eslint-parser` cannot be used alongside [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3).
+Note that `eslint-plugin-svelte` and `svelte-eslint-parser` cannot be used alongside [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3).
 
 See [User Guide](./user-guide.md).
 
 ## Migration Guide
 
-If you’re migrating from `eslint-plugin-svelte@1` or [`@ota-meshi/eslint-plugin-svelte`](https://www.npmjs.com/package/@ota-meshi/eslint-plugin-svelte), see the [migration guide](./migration.md).
+If you’re migrating from `eslint-plugin-svelte` v1 or [`@ota-meshi/eslint-plugin-svelte`](https://www.npmjs.com/package/@ota-meshi/eslint-plugin-svelte), see the [migration guide](./migration.md).
 
 ## Versioning Policy