Skip to content

Commit 038c26c

Browse files
jwbthljharb
jwbth
and
ljharb
committed
[readme] Clarify how to install the plugin
The markup was misleading, as it put several alternatives into one block of code while not making it clear where the alternatives begin and end, forcing the reader to think hard about it. Also converted most yaml examples to jsonc. Co-authored-by: jwbth <[email protected]> Co-authored-by: Jordan Harband <[email protected]>
1 parent 32a2b89 commit 038c26c

2 files changed

Lines changed: 115 additions & 64 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
3030
- [Refactor] `exportMapBuilder`: avoid hoisting ([#2989], thanks [@soryy708])
3131
- [Refactor] `ExportMap`: extract "builder" logic to separate files ([#2991], thanks [@soryy708])
3232
- [Docs] [`order`]: update the description of the `pathGroupsExcludedImportTypes` option ([#3036], thanks [@liby])
33+
- [readme] Clarify how to install the plugin ([#2993], thanks [@jwbth])
3334

3435
## [2.29.1] - 2023-12-14
3536

@@ -1133,6 +1134,7 @@ for info on changes for earlier releases.
11331134
[#3011]: https://github.com/import-js/eslint-plugin-import/pull/3011
11341135
[#3004]: https://github.com/import-js/eslint-plugin-import/pull/3004
11351136
[#2998]: https://github.com/import-js/eslint-plugin-import/pull/2998
1137+
[#2993]: https://github.com/import-js/eslint-plugin-import/pull/2993
11361138
[#2991]: https://github.com/import-js/eslint-plugin-import/pull/2991
11371139
[#2989]: https://github.com/import-js/eslint-plugin-import/pull/2989
11381140
[#2987]: https://github.com/import-js/eslint-plugin-import/pull/2987
@@ -1835,6 +1837,7 @@ for info on changes for earlier releases.
18351837
[@jseminck]: https://github.com/jseminck
18361838
[@julien1619]: https://github.com/julien1619
18371839
[@justinanastos]: https://github.com/justinanastos
1840+
[@jwbth]: https://github.com/jwbth
18381841
[@k15a]: https://github.com/k15a
18391842
[@kentcdodds]: https://github.com/kentcdodds
18401843
[@kevin940726]: https://github.com/kevin940726

‎README.md‎

Lines changed: 112 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -108,35 +108,37 @@ npm install eslint-plugin-import --save-dev
108108

109109
### Config - Legacy (`.eslintrc`)
110110

111-
All rules are off by default. However, you may configure them manually
112-
in your `.eslintrc.(yml|json|js)`, or extend one of the canned configs:
111+
All rules are off by default. However, you may extend one of the preset configs, or configure them manually in your `.eslintrc.(yml|json|js)`.
113112

114-
```yaml
115-
---
116-
extends:
117-
- eslint:recommended
118-
- plugin:import/recommended
119-
# alternatively, 'recommended' is the combination of these two rule sets:
120-
- plugin:import/errors
121-
- plugin:import/warnings
122-
123-
# or configure manually:
124-
plugins:
125-
- import
126-
127-
rules:
128-
import/no-unresolved: [2, { commonjs: true, amd: true }]
129-
import/named: 2
130-
import/namespace: 2
131-
import/default: 2
132-
import/export: 2
133-
# etc...
113+
- Extending a preset config:
114+
115+
```jsonc
116+
{
117+
"extends": [
118+
"eslint:recommended",
119+
"plugin:import/recommended",
120+
],
121+
}
122+
```
123+
124+
- Configuring manually:
125+
126+
```jsonc
127+
{
128+
"rules": {
129+
"import/no-unresolved": ["error", { "commonjs": true, "amd": true }]
130+
"import/named": "error",
131+
"import/namespace": "error",
132+
"import/default": "error",
133+
"import/export": "error",
134+
// etc...
135+
},
136+
},
134137
```
135138

136139
### Config - Flat (`eslint.config.js`)
137140

138-
All rules are off by default. However, you may configure them manually
139-
in your `eslint.config.(js|cjs|mjs)`, or extend one of the canned configs:
141+
All rules are off by default. However, you may configure them manually in your `eslint.config.(js|cjs|mjs)`, or extend one of the preset configs:
140142

141143
```js
142144
import importPlugin from 'eslint-plugin-import';
@@ -166,18 +168,23 @@ You may use the following snippet or assemble your own config using the granular
166168

167169
Make sure you have installed [`@typescript-eslint/parser`] and [`eslint-import-resolver-typescript`] which are used in the following configuration.
168170

169-
```yaml
170-
extends:
171-
- eslint:recommended
172-
- plugin:import/recommended
173-
# the following lines do the trick
174-
- plugin:import/typescript
175-
settings:
176-
import/resolver:
177-
# You will also need to install and configure the TypeScript resolver
178-
# See also https://github.com/import-js/eslint-import-resolver-typescript#configuration
179-
typescript: true
180-
node: true
171+
```jsonc
172+
{
173+
"extends": [
174+
"eslint:recommended",
175+
"plugin:import/recommended",
176+
// the following lines do the trick
177+
"plugin:import/typescript",
178+
],
179+
"settings": {
180+
"import/resolver": {
181+
// You will also need to install and configure the TypeScript resolver
182+
// See also https://github.com/import-js/eslint-import-resolver-typescript#configuration
183+
"typescript": true,
184+
"node": true,
185+
},
186+
},
187+
}
181188
```
182189

183190
[`@typescript-eslint/parser`]: https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/parser
@@ -206,6 +213,16 @@ You can reference resolvers in several ways (in order of precedence):
206213

207214
- as a conventional `eslint-import-resolver` name, like `eslint-import-resolver-foo`:
208215

216+
```jsonc
217+
// .eslintrc
218+
{
219+
"settings": {
220+
// uses 'eslint-import-resolver-foo':
221+
"import/resolver": "foo",
222+
},
223+
}
224+
```
225+
209226
```yaml
210227
# .eslintrc.yml
211228
settings:
@@ -226,6 +243,15 @@ module.exports = {
226243

227244
- with a full npm module name, like `my-awesome-npm-module`:
228245

246+
```jsonc
247+
// .eslintrc
248+
{
249+
"settings": {
250+
"import/resolver": "my-awesome-npm-module",
251+
},
252+
}
253+
```
254+
229255
```yaml
230256
# .eslintrc.yml
231257
settings:
@@ -321,11 +347,15 @@ In practice, this means rules other than [`no-unresolved`](./docs/rules/no-unres
321347

322348
`no-unresolved` has its own [`ignore`](./docs/rules/no-unresolved.md#ignore) setting.
323349

324-
```yaml
325-
settings:
326-
import/ignore:
327-
- \.coffee$ # fraught with parse errors
328-
- \.(scss|less|css)$ # can't parse unprocessed CSS modules, either
350+
```jsonc
351+
{
352+
"settings": {
353+
"import/ignore": [
354+
"\.coffee$", // fraught with parse errors
355+
"\.(scss|less|css)$", // can't parse unprocessed CSS modules, either
356+
],
357+
},
358+
}
329359
```
330360

331361
### `import/core-modules`
@@ -344,10 +374,13 @@ import 'electron' // without extra config, will be flagged as unresolved!
344374
that would otherwise be unresolved. To avoid this, you may provide `electron` as a
345375
core module:
346376

347-
```yaml
348-
# .eslintrc.yml
349-
settings:
350-
import/core-modules: [ electron ]
377+
```jsonc
378+
// .eslintrc
379+
{
380+
"settings": {
381+
"import/core-modules": ["electron"],
382+
},
383+
}
351384
```
352385

353386
In Electron's specific case, there is a shared config named `electron`
@@ -380,11 +413,15 @@ dependency parser will require and use the map key as the parser instead of the
380413
configured ESLint parser. This is useful if you're inter-op-ing with TypeScript
381414
directly using webpack, for example:
382415

383-
```yaml
384-
# .eslintrc.yml
385-
settings:
386-
import/parsers:
387-
"@typescript-eslint/parser": [ .ts, .tsx ]
416+
```jsonc
417+
// .eslintrc
418+
{
419+
"settings": {
420+
"import/parsers": {
421+
"@typescript-eslint/parser": [".ts", ".tsx"],
422+
},
423+
},
424+
}
388425
```
389426

390427
In this case, [`@typescript-eslint/parser`](https://www.npmjs.com/package/@typescript-eslint/parser)
@@ -414,20 +451,28 @@ For long-lasting processes, like [`eslint_d`] or [`eslint-loader`], however, it'
414451

415452
If you never use [`eslint_d`] or [`eslint-loader`], you may set the cache lifetime to `Infinity` and everything should be fine:
416453

417-
```yaml
418-
# .eslintrc.yml
419-
settings:
420-
import/cache:
421-
lifetime: ∞ # or Infinity
454+
```jsonc
455+
// .eslintrc
456+
{
457+
"settings": {
458+
"import/cache": {
459+
"lifetime": "∞", // or Infinity, in a JS config
460+
},
461+
},
462+
}
422463
```
423464

424465
Otherwise, set some integer, and cache entries will be evicted after that many seconds have elapsed:
425466

426-
```yaml
427-
# .eslintrc.yml
428-
settings:
429-
import/cache:
430-
lifetime: 5 # 30 is the default
467+
```jsonc
468+
// .eslintrc
469+
{
470+
"settings": {
471+
"import/cache": {
472+
"lifetime": 5, // 30 is the default
473+
},
474+
},
475+
}
431476
```
432477

433478
[`eslint_d`]: https://www.npmjs.com/package/eslint_d
@@ -441,10 +486,13 @@ By default, any package referenced from [`import/external-module-folders`](#impo
441486

442487
For example, if your packages in a monorepo are all in `@scope`, you can configure `import/internal-regex` like this
443488

444-
```yaml
445-
# .eslintrc.yml
446-
settings:
447-
import/internal-regex: ^@scope/
489+
```jsonc
490+
// .eslintrc
491+
{
492+
"settings": {
493+
"import/internal-regex": "^@scope/",
494+
},
495+
}
448496
```
449497

450498
## SublimeLinter-eslint

0 commit comments

Comments
 (0)