diff --git a/README.md b/README.md index a8529a3f..1f6994ea 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,3 @@ -# svelte-eslint-parser - -[Svelte] parser for [ESLint]. -You can check it on [Online DEMO](https://sveltejs.github.io/svelte-eslint-parser/playground). - -> [!NOTE] -> This README is in development.\ -> Please refer to the README for the version you are using.\ -> For example, - [![NPM license](https://img.shields.io/npm/l/svelte-eslint-parser.svg)](https://www.npmjs.com/package/svelte-eslint-parser) [![NPM version](https://img.shields.io/npm/v/svelte-eslint-parser.svg)](https://www.npmjs.com/package/svelte-eslint-parser) [![NPM downloads](https://img.shields.io/badge/dynamic/json.svg?label=downloads&colorB=green&suffix=/day&query=$.downloads&uri=https://api.npmjs.org//downloads/point/last-day/svelte-eslint-parser&maxAge=3600)](http://www.npmtrends.com/svelte-eslint-parser) @@ -18,47 +8,64 @@ You can check it on [Online DEMO](https://sveltejs.github.io/svelte-eslint-parse [![Build Status](https://github.com/sveltejs/svelte-eslint-parser/workflows/CI/badge.svg?branch=main)](https://github.com/sveltejs/svelte-eslint-parser/actions?query=workflow%3ACI) [![Coverage Status](https://coveralls.io/repos/github/sveltejs/svelte-eslint-parser/badge.svg?branch=main)](https://coveralls.io/github/sveltejs/svelte-eslint-parser?branch=main) -## ⤴️ Motivation +
+ +# svelte-eslint-parser + +## [Svelte](https://svelte.dev/) parser for [ESLint](https://eslint.org/). + +[Live DEMO](https://sveltejs.github.io/svelte-eslint-parser/playground) • +[Discord](https://svelte.dev/chat) -The [svelte-eslint-parser] aims to make it easy to create your own ESLint rules for [Svelte]. +
-The [`eslint-plugin-svelte`] is an ESLint plugin that uses the [svelte-eslint-parser]. I have already [implemented some rules]. +## Motivation -[`eslint-plugin-svelte`]: https://github.com/sveltejs/eslint-plugin-svelte -[implemented some rules]: https://sveltejs.github.io/eslint-plugin-svelte/rules/ +The `svelte-eslint-parser` aims to make it easy to create your own ESLint rules for [Svelte](https://svelte.dev/). + +[eslint-plugin-svelte](https://github.com/sveltejs/eslint-plugin-svelte) is an ESLint plugin built upon this parser, and it already [implements some rules](https://sveltejs.github.io/eslint-plugin-svelte/rules/). ### ESLint Plugins Using svelte-eslint-parser #### [eslint-plugin-svelte](https://sveltejs.github.io/eslint-plugin-svelte/) ESLint plugin for Svelte. -It provides many unique check rules by using the template AST. +Provides a variety of template-based checks using the Svelte AST. #### [@intlify/eslint-plugin-svelte](https://github.com/intlify/eslint-plugin-svelte) -ESLint plugin for internationalization (i18n) with Svelte. -It provides rules to help internationalization your application created with Svelte. +ESLint plugin for internationalization (i18n) in Svelte applications, offering helpful i18n-related rules. + +--- -## 💿 Installation +## Installation ```bash npm install --save-dev eslint svelte-eslint-parser ``` -## 📖 Usage +--- -1. Write `parser` option into your ESLint Config file. -2. Use glob patterns or `--ext .svelte` CLI option. +## Usage ### ESLint Config (`eslint.config.js`) ```js import js from "@eslint/js"; import svelteParser from "svelte-eslint-parser"; + export default [ js.configs.recommended, { - files: ["**/*.svelte", "*.svelte"], + files: [ + "**/*.svelte", + "*.svelte", + // Need to specify the file extension for Svelte 5 with rune symbols + "**/*.svelte.js", + "*.svelte.js", + "**/*.svelte.ts", + "*.svelte.ts", + ], languageOptions: { parser: svelteParser, }, @@ -68,23 +75,27 @@ export default [ ### CLI -```console -$ eslint "src/**/*.{js,svelte}" -# or -$ eslint src --ext .svelte +```bash +eslint "src/**/*.{js,svelte}" ``` -## 🔧 Options +--- + +## Options + +The [parserOptions](https://eslint.org/docs/latest/use/configure/parser#configure-parser-options) for this parser generally match what [espree](https://github.com/eslint/espree#usage)—ESLint's default parser—supports. -[`parserOptions`] has the same properties as what [espree](https://github.com/eslint/espree#usage), the default parser of ESLint, is supporting. For example: ```js import svelteParser from "svelte-eslint-parser"; + export default [ // ... { - files: ["**/*.svelte", "*.svelte"], + files: [ + // Set .svelte/.js/.ts files. See above for more details. + ], languageOptions: { parser: svelteParser, parserOptions: { @@ -101,20 +112,18 @@ export default [ ]; ``` -[`parserOptions`]: https://eslint.org/docs/latest/use/configure/parser#configure-parser-options - ### parserOptions.parser -You can use `parserOptions.parser` property to specify a custom parser to parse `