@santi020k/eslint-config-basic 0.4.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +315 -0
- package/package.json +3 -2
package/README.md
ADDED
|
@@ -0,0 +1,315 @@
|
|
|
1
|
+
# @santi020k/eslint-config-basic
|
|
2
|
+
|
|
3
|
+
[](https://github.com/santi020k/eslint-config-basic/actions/workflows/build.yml)
|
|
4
|
+
[](https://www.npmjs.com/package/@santi020k/eslint-config-basic)
|
|
5
|
+
[](https://www.npmjs.com/package/@santi020k/eslint-config-basic)
|
|
6
|
+
[](https://santi020k.github.io/eslint-config-basic/)
|
|
7
|
+
[](https://opensource.org/licenses/MIT)
|
|
8
|
+
|
|
9
|
+
Welcome to **@santi020k/eslint-config-basic**, a comprehensive and opinionated ESLint configuration package for JavaScript, TypeScript, React, and other frameworks. Born from a desire to eliminate bad practices and ensure high-quality code, this configuration automates code quality checks and reduces cognitive load during code reviews by enforcing a consistent coding style across your projects.
|
|
10
|
+
|
|
11
|
+
## Why Use This Configuration?
|
|
12
|
+
|
|
13
|
+
- **Consistency:** Enforces a uniform coding style, reducing code discrepancies and easing collaboration.
|
|
14
|
+
- **Quality:** Promotes best practices and helps avoid common pitfalls in JavaScript, TypeScript, Frameworks, Libraries, Tools and more.
|
|
15
|
+
- **Automation:** Catches issues early in the development process, minimizing manual code review effort.
|
|
16
|
+
- **Customization:** While it comes with strong opinions, you can tailor it to suit your project's specific needs.
|
|
17
|
+
|
|
18
|
+
## Installation
|
|
19
|
+
|
|
20
|
+
Before installing, make sure you have ESLint (version 9.0.0 or 10.0.0 or later) installed:
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
npm install eslint --save-dev
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
Then, install the configuration package. **Important:** I recommend using a fixed version (do not use `^` or `~`), as any new functionality or change may introduce new linter errors that require manual updates.
|
|
27
|
+
|
|
28
|
+
```bash
|
|
29
|
+
npm install @santi020k/eslint-config-basic --save-dev
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## Usage
|
|
33
|
+
|
|
34
|
+
Create an `eslint.config.js` file (or update your existing one) and extend **@santi020k/eslint-config-basic** based on your project type.
|
|
35
|
+
|
|
36
|
+
### Basic Usage
|
|
37
|
+
|
|
38
|
+
For a basic JavaScript/Node.js project:
|
|
39
|
+
|
|
40
|
+
```js
|
|
41
|
+
import { eslintConfig } from '@santi020k/eslint-config-basic'
|
|
42
|
+
|
|
43
|
+
export default [
|
|
44
|
+
...eslintConfig()
|
|
45
|
+
// Your custom config
|
|
46
|
+
]
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
### Advanced Usage
|
|
50
|
+
|
|
51
|
+
For projects that require specific configurations (e.g., TypeScript, React, Next.js, ...Etc), use the appropriate options:
|
|
52
|
+
|
|
53
|
+
```js
|
|
54
|
+
import { ConfigOption, eslintConfig } from '@santi020k/eslint-config-basic'
|
|
55
|
+
|
|
56
|
+
// TypeScript project
|
|
57
|
+
export default [
|
|
58
|
+
...eslintConfig({ config: [ConfigOption.Ts] })
|
|
59
|
+
// Your custom config
|
|
60
|
+
]
|
|
61
|
+
|
|
62
|
+
// React project
|
|
63
|
+
export default [
|
|
64
|
+
...eslintConfig({ config: [ConfigOption.React] })
|
|
65
|
+
// Your custom config
|
|
66
|
+
]
|
|
67
|
+
|
|
68
|
+
// TypeScript and React project
|
|
69
|
+
export default [
|
|
70
|
+
...eslintConfig({ config: [ConfigOption.React, ConfigOption.Ts] })
|
|
71
|
+
// Your custom config
|
|
72
|
+
]
|
|
73
|
+
|
|
74
|
+
// Next.js project
|
|
75
|
+
export default [
|
|
76
|
+
...eslintConfig({ config: [ConfigOption.Next] })
|
|
77
|
+
// Your custom config
|
|
78
|
+
]
|
|
79
|
+
|
|
80
|
+
// Expo project
|
|
81
|
+
export default [
|
|
82
|
+
...eslintConfig({ config: [ConfigOption.Expo] })
|
|
83
|
+
// Your custom config
|
|
84
|
+
]
|
|
85
|
+
|
|
86
|
+
// Astro project (supports Astro with React)
|
|
87
|
+
export default [
|
|
88
|
+
...eslintConfig({ config: [ConfigOption.Astro] })
|
|
89
|
+
// Your custom config
|
|
90
|
+
]
|
|
91
|
+
|
|
92
|
+
// NestJS project
|
|
93
|
+
export default [
|
|
94
|
+
...eslintConfig({ config: [ConfigOption.Nest] })
|
|
95
|
+
// Your custom config
|
|
96
|
+
]
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
### Optional Usage
|
|
100
|
+
|
|
101
|
+
There are additional optional parameters to add support for other front-end/back-end technologies. This enables you to extend support as needed:
|
|
102
|
+
|
|
103
|
+
```js
|
|
104
|
+
import { ConfigOption, eslintConfig, OptionalOption } from '@santi020k/eslint-config-basic'
|
|
105
|
+
|
|
106
|
+
export default [
|
|
107
|
+
...eslintConfig({
|
|
108
|
+
config: [ConfigOption.Next, ConfigOption.Ts],
|
|
109
|
+
optionals: [
|
|
110
|
+
// Spell checker
|
|
111
|
+
OptionalOption.Cspell,
|
|
112
|
+
// TailwindCss
|
|
113
|
+
OptionalOption.Tailwind,
|
|
114
|
+
// Vitest and testing-library
|
|
115
|
+
OptionalOption.Vitest,
|
|
116
|
+
// I18next
|
|
117
|
+
OptionalOption.I18next,
|
|
118
|
+
// Mdx
|
|
119
|
+
OptionalOption.Mdx,
|
|
120
|
+
// Markdown
|
|
121
|
+
OptionalOption.Markdown,
|
|
122
|
+
// Stencil
|
|
123
|
+
OptionalOption.Stencil,
|
|
124
|
+
// SonarJS
|
|
125
|
+
OptionalOption.Sonarjs,
|
|
126
|
+
// Prettier
|
|
127
|
+
OptionalOption.Prettier
|
|
128
|
+
]
|
|
129
|
+
})
|
|
130
|
+
// Your custom config
|
|
131
|
+
]
|
|
132
|
+
```
|
|
133
|
+
|
|
134
|
+
### Settings Usage (Experimental)
|
|
135
|
+
|
|
136
|
+
This experimental option allows ESLint to honor your `.gitignore` file:
|
|
137
|
+
|
|
138
|
+
```js
|
|
139
|
+
import { eslintConfig, SettingOption } from '@santi020k/eslint-config-basic'
|
|
140
|
+
|
|
141
|
+
export default [
|
|
142
|
+
...eslintConfig({
|
|
143
|
+
// ESLint will ignore files specified in .gitignore
|
|
144
|
+
settings: [SettingOption.Gitignore]
|
|
145
|
+
})
|
|
146
|
+
// Your custom config
|
|
147
|
+
]
|
|
148
|
+
```
|
|
149
|
+
|
|
150
|
+
## AI Agent Capabilities
|
|
151
|
+
|
|
152
|
+
This project is optimized for AI agents and LLM-based tools. It includes an `.agent/skills/` directory containing specialized workflows, guidelines, and context specific to this monorepo. Agents can automatically use these skills to assist with development, testing, and release processes.
|
|
153
|
+
|
|
154
|
+
## Monorepo Structure
|
|
155
|
+
|
|
156
|
+
This project is a monorepo managed with **Turbo** and **npm Workspaces**.
|
|
157
|
+
|
|
158
|
+
- `packages/basic`: Main package entry point.
|
|
159
|
+
- `packages/core`: Core logic and shared types.
|
|
160
|
+
- `packages/typescript`: TypeScript specific rules.
|
|
161
|
+
- `packages/react`: React and Hooks rules.
|
|
162
|
+
- `packages/next`: Next.js rules.
|
|
163
|
+
- `packages/astro`: Astro rules.
|
|
164
|
+
- `packages/expo`: Expo/React Native rules.
|
|
165
|
+
- `packages/optionals`: Optional configurations (Tailwind, Vitest, etc.).
|
|
166
|
+
- `packages/tests`: Integration tests.
|
|
167
|
+
- `packages/playground`: Testing playground for local development.
|
|
168
|
+
|
|
169
|
+
## Development
|
|
170
|
+
|
|
171
|
+
If you want to contribute or modify the configurations:
|
|
172
|
+
|
|
173
|
+
### Prerequisites
|
|
174
|
+
|
|
175
|
+
- Node.js (version specified in `.nvmrc`)
|
|
176
|
+
- npm
|
|
177
|
+
|
|
178
|
+
### Setup
|
|
179
|
+
|
|
180
|
+
```bash
|
|
181
|
+
npm install
|
|
182
|
+
```
|
|
183
|
+
|
|
184
|
+
### Useful Commands
|
|
185
|
+
```bash
|
|
186
|
+
npm run build # Build all packages using Turbo
|
|
187
|
+
npm run lint # Lint all packages
|
|
188
|
+
npm run test # Run integration tests
|
|
189
|
+
npm run dev # Development mode with watch
|
|
190
|
+
npm run inspector # Open ESLint config inspector
|
|
191
|
+
npm run docs # Generate API documentation
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
### Publishing Workflow
|
|
195
|
+
|
|
196
|
+
This repository uses **Changesets** (`@changesets/cli`) to automatically handle workspace dependency versioning and publishing to npm.
|
|
197
|
+
|
|
198
|
+
To publish a new version of the packages:
|
|
199
|
+
|
|
200
|
+
1. Make sure you are authenticated with npm in your terminal (`npm login`).
|
|
201
|
+
2. Generate a changeset summarizing your changes:
|
|
202
|
+
```bash
|
|
203
|
+
npm run changeset
|
|
204
|
+
```
|
|
205
|
+
3. Consume the changeset to bump package versions automatically:
|
|
206
|
+
```bash
|
|
207
|
+
npm run version-packages
|
|
208
|
+
```
|
|
209
|
+
4. Build all packages and publish them to npm:
|
|
210
|
+
```bash
|
|
211
|
+
npm run release
|
|
212
|
+
```
|
|
213
|
+
|
|
214
|
+
### ESLint Config Inspector
|
|
215
|
+
|
|
216
|
+
You can visually inspect the generated ESLint configuration using the built-in inspector:
|
|
217
|
+
|
|
218
|
+
```bash
|
|
219
|
+
npm run inspector
|
|
220
|
+
```
|
|
221
|
+
|
|
222
|
+
This opens an interactive UI where you can see all active rules, plugins, and config layers. It's useful for debugging which rules are applied and understanding the final merged configuration.
|
|
223
|
+
|
|
224
|
+
### API Documentation
|
|
225
|
+
|
|
226
|
+
Auto-generated API docs are available online:
|
|
227
|
+
[**https://santi020k.github.io/eslint-config-basic/**](https://santi020k.github.io/eslint-config-basic/)
|
|
228
|
+
|
|
229
|
+
You can also generate them locally:
|
|
230
|
+
|
|
231
|
+
```bash
|
|
232
|
+
npm run docs
|
|
233
|
+
```
|
|
234
|
+
|
|
235
|
+
This outputs markdown documentation to the `docs/` directory.
|
|
236
|
+
|
|
237
|
+
## Compatibility & Known Issues
|
|
238
|
+
|
|
239
|
+
### Astro 5+
|
|
240
|
+
|
|
241
|
+
This package includes robust defaults for Astro projects, including:
|
|
242
|
+
|
|
243
|
+
- Automatic detection of virtual scripts inside `.astro` files.
|
|
244
|
+
- Disabled `react/jsx-no-undef` (Astro handles this).
|
|
245
|
+
- Enforced `never` comma-dangle for Astro templates.
|
|
246
|
+
- Support for JSX/TSX inside Astro components.
|
|
247
|
+
|
|
248
|
+
## Opinionated but Flexible
|
|
249
|
+
|
|
250
|
+
|
|
251
|
+
This ESLint configuration is based on my personal preferences and practices, and it may evolve over time. **Important:** I recommend using a fixed version to avoid unexpected changes that might introduce new linter errors. To ensure stability, do not use `^` or `~` when specifying the version. If a rule feels too strict, consider changing it from an error to a warning to allow more flexibility during development.
|
|
252
|
+
|
|
253
|
+
## Scripts
|
|
254
|
+
|
|
255
|
+
Add the following useful scripts to your `package.json`:
|
|
256
|
+
|
|
257
|
+
```json
|
|
258
|
+
"scripts": {
|
|
259
|
+
"lint": "eslint . --report-unused-disable-directives",
|
|
260
|
+
"lint:fix": "npm run lint -- --fix"
|
|
261
|
+
}
|
|
262
|
+
```
|
|
263
|
+
|
|
264
|
+
## How to Implement in an Existing Project
|
|
265
|
+
|
|
266
|
+
1. Install the Dependencies: Ensure that both ESLint and this configuration package are installed.
|
|
267
|
+
2. Update Your ESLint Configuration: Extend **@santi020k/eslint-config-basic** in your ESLint configuration file as shown above.
|
|
268
|
+
3. Run ESLint: Lint your project files and automatically fix issues if possible:
|
|
269
|
+
|
|
270
|
+
```bash
|
|
271
|
+
npm run lint
|
|
272
|
+
npm run lint:fix
|
|
273
|
+
```
|
|
274
|
+
|
|
275
|
+
4. **Adjust as Necessary:** Review and modify the linting rules based on your project's needs. Some rules might be too strict or not applicable; feel free to disable or adjust them.
|
|
276
|
+
|
|
277
|
+
## Future Features
|
|
278
|
+
|
|
279
|
+
- [x] Testing
|
|
280
|
+
- [x] Refactored rules structure (Monorepo transition)
|
|
281
|
+
- [x] Astro and Expo support
|
|
282
|
+
- [x] Enhanced documentation
|
|
283
|
+
- [ ] Additional framework support (contributions welcome!):
|
|
284
|
+
- [ ] Vue
|
|
285
|
+
- [ ] Angular
|
|
286
|
+
- [x] NestJS
|
|
287
|
+
|
|
288
|
+
## Contributing
|
|
289
|
+
|
|
290
|
+
Contributions are welcome! Please read the [Contributing Guide](CONTRIBUTING.md) for details on setting up the project, adding new configurations, and submitting pull requests.
|
|
291
|
+
|
|
292
|
+
## Acknowledgements
|
|
293
|
+
|
|
294
|
+
Special thanks to the developers and maintainers of the following libraries, which form the backbone of this ESLint configuration:
|
|
295
|
+
|
|
296
|
+
- eslint-config-standard
|
|
297
|
+
- eslint-plugin-import
|
|
298
|
+
- eslint-plugin-jsx-a11y
|
|
299
|
+
- eslint-plugin-n
|
|
300
|
+
- eslint-plugin-promise
|
|
301
|
+
- eslint-plugin-react
|
|
302
|
+
- eslint-plugin-react-hooks
|
|
303
|
+
- eslint-plugin-simple-import-sort
|
|
304
|
+
- eslint-plugin-sonarjs
|
|
305
|
+
- eslint-plugin-unused-imports
|
|
306
|
+
- @stylistic/eslint-plugin
|
|
307
|
+
- @typescript-eslint
|
|
308
|
+
- @cspell/eslint-plugin
|
|
309
|
+
- eslint-plugin-tailwindcss
|
|
310
|
+
- eslint-plugin-vitest
|
|
311
|
+
- ...and many others
|
|
312
|
+
|
|
313
|
+
Their ongoing contributions help maintain the high standards of code quality we all strive for.
|
|
314
|
+
|
|
315
|
+
Thank you for using **@santi020k/eslint-config-basic**. Together, let's write cleaner, more maintainable code!
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@santi020k/eslint-config-basic",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.0",
|
|
4
4
|
"description": "A comprehensive ESLint configuration package for JavaScript, TypeScript, and React projects.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
"build:pack": "npm pack",
|
|
21
21
|
"dev": "tsup --watch",
|
|
22
22
|
"clean": "rm -rf dist",
|
|
23
|
-
"check:exports": "publint"
|
|
23
|
+
"check:exports": "publint",
|
|
24
|
+
"prepack": "rm -f README.md && cp ../../README.md ./README.md"
|
|
24
25
|
},
|
|
25
26
|
"dependencies": {
|
|
26
27
|
"@santi020k/eslint-config-astro": "*",
|