You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+34-19Lines changed: 34 additions & 19 deletions
Original file line number
Diff line number
Diff line change
@@ -56,35 +56,50 @@ module.exports = {
56
56
57
57
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.
58
58
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:
60
62
61
63
```javascript
62
64
module.exports= {
63
65
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
plugins: ['svelte3', '@typescript-eslint'], // add the TypeScript plugin
74
-
overrides: [{ files: ['*.svelte'], processor:'svelte3/svelte3' }], // this stays the same
76
+
rules: {
77
+
// ...
78
+
},
75
79
settings: {
76
80
'svelte3/typescript':require('typescript'), // pass the TypeScript package to the Svelte plugin
77
81
// ...
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
83
92
tsconfigRootDir:__dirname,
84
93
project: ['./tsconfig.json'],
85
94
extraFileExtensions: ['.svelte'],
86
95
},
87
-
}
96
+
extends: [ // then, enable whichever type-aware rules you want to use
@@ -129,9 +144,9 @@ The default is to not use named code blocks.
129
144
130
145
### `svelte3/typescript`
131
146
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')`.
0 commit comments