Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bluzzi/eslint-config
ESLint configuration preset for linting and formatting all your files ⚙️
https://github.com/bluzzi/eslint-config
eslint eslint-config
Last synced: 27 days ago
JSON representation
ESLint configuration preset for linting and formatting all your files ⚙️
- Host: GitHub
- URL: https://github.com/bluzzi/eslint-config
- Owner: Bluzzi
- License: mit
- Created: 2022-11-18T05:54:11.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-10-01T11:28:45.000Z (about 1 month ago)
- Last Synced: 2024-10-11T03:03:35.735Z (27 days ago)
- Topics: eslint, eslint-config
- Language: TypeScript
- Homepage: https://eslint.camilledugas.me
- Size: 238 KB
- Stars: 10
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @we-use/eslint-config
A ready-to-use ESLint config preset that's highly opinionated and strict on best practices, allowing you to both lint and [format](https://eslint.style/guide/why) any file that can be used in the JavaScript ecosystem.
- 📖 formatting (Prettier alternative) with only basic configurations (semi, quotes, indent)
- ⚒️ very strict rules for JS and TS, which encourages best practices
- 🌏 designed to work with TS, JSX, React, JSON, YAML, TOML, GraphQL, CSS, HTML and Markdown
- ✅ automatically enables specific rules based on your dependencies
- 🧲 uses the recommended shared configs (ESLint, TSLint, Stylistic...)
If you're looking for a less opinionated configuration with more customization possibilities, we recommend the [Antfu preset](https://github.com/antfu/eslint-config).
## Installation
Installing the config preset in your project.
### Packages
```
npm install -D eslint @we-use/eslint-config
```
```
yarn add --dev eslint @we-use/eslint-config
```
```
pnpm install -D eslint @we-use/eslint-config
```
### Configuration file
Create the `eslint.config.mjs` file at the root of the project and add the minimum configuration:
```js
import { eslintConfig } from "@we-use/eslint-config";
export default eslintConfig();
```
### Scripts
In your package.json file, you can optionally add the following scripts to easily run ESLint in your project:
```json
{
"scripts": {
"lint": "eslint .",
"lint:fix": "eslint . --fix"
}
}
```
## VS Code support
Installation and configuration of the VS Code plugin to take advantage of an automatic correction when saving a file, as well as a display of problems.
Install [VS Code ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) and add the following settings to your `.vscode/settings.json`:
```jsonc
{
// Enable the ESlint flat config support:
"eslint.experimental.useFlatConfig": true,
// Disable the default formatter, use eslint instead:
"prettier.enable": false,
"editor.formatOnSave": false,
// Auto fix:
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
// Silent the stylistic rules in you IDE, but still auto fix them:
"eslint.rules.customizations": [
{ "rule": "style/*", "severity": "off" },
{ "rule": "format/*", "severity": "off" },
{ "rule": "*-indent", "severity": "off" },
{ "rule": "*-spacing", "severity": "off" },
{ "rule": "*-spaces", "severity": "off" },
{ "rule": "*-order", "severity": "off" },
{ "rule": "*-dangle", "severity": "off" },
{ "rule": "*-newline", "severity": "off" },
{ "rule": "*quotes", "severity": "off" },
{ "rule": "*semi", "severity": "off" }
],
// Enable eslint for all supported languages:
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"html",
"markdown",
"json",
"jsonc",
"yaml",
"toml",
"gql",
"graphql"
]
}
```
## Customization
To enable TS [type aware rules](https://typescript-eslint.io/getting-started/typed-linting) (recommended for best practice with TS), you need to define the relative path to your `tsconfig.json`:
```js
export default eslintConfig({
typescript: { tsconfigPath: `./tsconfig.json` },
});
```
You can adjust some formatting options for your code, but we recommend sticking to [Stylistic](https://eslint.style/guide/config-presets)'s default rules for consistency within the JS community:
```js
export default eslintConfig({
stylistic: {
indent: 2,
quotes: 'single',
semi: false,
},
});
```
Finally, you can make full use of the power of [ESLint's flat configs](https://eslint.org/docs/latest/use/configure/configuration-files) to extend the configuration as much as you like:
```js
export default eslintConfig(
{
// The configuration options offered by our package
},
// From the second arguments they are ESLint Flat Configs
// you can have multiple configs:
{
files: ['**/*.ts'],
rules: {},
},
{
rules: {},
},
);
```
## Thanks
- [Anthony Fu](https://github.com/antfu), for his [config preset](https://github.com/antfu/eslint-config) and its work on [Stylistic](https://eslint.style/)
- [ESLint team](https://eslint.org/team/), for this [amazing project](https://eslint.org/) that pushes the whole JS ecosystem forward
## License
This package is MIT licensed.