Skip to content

Commit b3b1d61

Browse files
committed
adjust readme
1 parent d5b8020 commit b3b1d61

File tree

1 file changed

+34
-19
lines changed

1 file changed

+34
-19
lines changed

README.md

Lines changed: 34 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -56,35 +56,50 @@ module.exports = {
5656

5757
By default, this plugin needs to be able to `require('svelte/compiler')`. If ESLint, this plugin, and Svelte are all installed locally in your project, this should not be a problem.
5858

59-
If you want to use TypeScript, you need to adjust your ESLint configuration. In addition to the Svelte plugin, you also need the ESLint-TypeScript plugin. You need to install `typescript`, `@typescript-eslint/parser` and `@typescript-eslint/eslint-plugin` from npm and then adjust your config like this:
59+
### Installation with TypeScript
60+
61+
If you want to use TypeScript, you'll need a different ESLint configuration. In addition to the Svelte plugin, you also need the ESLint TypeScript parser and plugin. Install `typescript`, `@typescript-eslint/parser` and `@typescript-eslint/eslint-plugin` from npm and then adjust your config like this:
6062

6163
```javascript
6264
module.exports = {
6365
parser: '@typescript-eslint/parser', // add the TypeScript parser
64-
extends: [
65-
// optional - a standard rule set
66-
'eslint:recommended',
67-
'plugin:@typescript-eslint/recommended',
68-
// optional - if you want type-aware rules (also see `parserOptions` below).
69-
// Note that this results in slower checks
70-
// because the whole program needs to be compiled and type checked
71-
'plugin:@typescript-eslint/recommended-requiring-type-checking'
66+
plugins: [
67+
'svelte3',
68+
'@typescript-eslint' // add the TypeScript plugin
69+
],
70+
overrides: [ // this stays the same
71+
{
72+
files: ['*.svelte'],
73+
processor: 'svelte3/svelte3'
74+
}
7275
],
73-
plugins: ['svelte3', '@typescript-eslint'], // add the TypeScript plugin
74-
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }], // this stays the same
76+
rules: {
77+
// ...
78+
},
7579
settings: {
7680
'svelte3/typescript': require('typescript'), // pass the TypeScript package to the Svelte plugin
7781
// ...
78-
},
79-
// The following is only needed if you want to use type-aware rules
80-
// It assumes that your eslint config is at the root next to your tsconfig.json
81-
// More info: https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/TYPED_LINTING.md
82-
parserOptions: {
82+
}
83+
};
84+
```
85+
86+
If you also want to be able to use type-aware linting rules (which will result in slower linting, because the whole program needs to be compiled and type-checked), then you also need to add some `parserOptions` configuration. The values below assume that your ESLint config is at the root of your project next to your `tsconfig.json`. For more information, see [here](https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/TYPED_LINTING.md).
87+
88+
```javascript
89+
module.exports = {
90+
// ...
91+
parserOptions: { // add these parser options
8392
tsconfigRootDir: __dirname,
8493
project: ['./tsconfig.json'],
8594
extraFileExtensions: ['.svelte'],
8695
},
87-
}
96+
extends: [ // then, enable whichever type-aware rules you want to use
97+
'eslint:recommended',
98+
'plugin:@typescript-eslint/recommended',
99+
'plugin:@typescript-eslint/recommended-requiring-type-checking'
100+
],
101+
// ...
102+
};
88103
```
89104

90105
## Interactions with other plugins
@@ -129,9 +144,9 @@ The default is to not use named code blocks.
129144

130145
### `svelte3/typescript`
131146

132-
If you use TypeScript inside your Svelte components and want ESLint support, you need to set this option. It expects the TypeScript package.
147+
If you use TypeScript inside your Svelte components and want ESLint support, you need to set this option. It expects an instance of the TypeScript package. This probably means doing `'svelte3/typescript': require('typescript')`.
133148

134-
Example: `"svelte3/typescript": require("typescript")`
149+
The default is to not enable TypeScript support.
135150

136151
### `svelte3/compiler`
137152

0 commit comments

Comments
 (0)