Skip to content

Commit 1a9ef3d

Browse files
ota-meshiota-meshi
authored
feat: makes it optional whether to parse runes. (#536)
1 parent 249deb6 commit 1a9ef3d

30 files changed

+3905
-55
lines changed

‎.changeset/shy-cups-visit.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"svelte-eslint-parser": minor
3+
---
4+
5+
feat: makes it optional whether to parse runes.

‎README.md

+46-2
Original file line numberDiff line numberDiff line change
@@ -245,9 +245,34 @@ For example in `.eslintrc.*`:
245245
}
246246
```
247247

248+
### parserOptions.svelteConfig
249+
250+
If you are using `eslint.config.js`, you can provide a `svelte.config.js` in the `parserOptions.svelteConfig` property.
251+
252+
For example:
253+
254+
```js
255+
import svelteConfig from "./svelte.config.js";
256+
export default [
257+
{
258+
files: ["**/*.svelte", "*.svelte"],
259+
languageOptions: {
260+
parser: svelteParser,
261+
parserOptions: {
262+
svelteConfig: svelteConfig,
263+
},
264+
},
265+
},
266+
];
267+
```
268+
269+
If `parserOptions.svelteConfig` is not specified, some config will be statically parsed from the `svelte.config.js` file.
270+
271+
The `.eslintrc.*` style configuration cannot load `svelte.config.js` because it cannot use ESM. We recommend using the `eslint.config.js` style configuration.
272+
248273
### parserOptions.svelteFeatures
249274

250-
You can use `parserOptions.svelteFeatures` property to specify how to parse related to Svelte features. For example:
275+
You can use `parserOptions.svelteFeatures` property to specify how to parse related to Svelte features.
251276

252277
For example in `eslint.config.js`:
253278

@@ -259,6 +284,12 @@ export default [
259284
parser: svelteParser,
260285
parserOptions: {
261286
svelteFeatures: {
287+
/* -- Experimental Svelte Features -- */
288+
/* It may be changed or removed in minor versions without notice. */
289+
// If true, it will analyze Runes.
290+
// By default, it will try to read `compilerOptions.runes` from `svelte.config.js`.
291+
// However, note that if `parserOptions.svelteConfig` is not specified and the file cannot be parsed by static analysis, it will behave as `false`.
292+
runes: false,
262293
/* -- Experimental Svelte Features -- */
263294
/* It may be changed or removed in minor versions without notice. */
264295
// Whether to parse the `generics` attribute.
@@ -278,6 +309,12 @@ For example in `.eslintrc.*`:
278309
"parser": "svelte-eslint-parser",
279310
"parserOptions": {
280311
"svelteFeatures": {
312+
/* -- Experimental Svelte Features -- */
313+
/* It may be changed or removed in minor versions without notice. */
314+
// If true, it will analyze Runes.
315+
// By default, it will try to read `compilerOptions.runes` from `svelte.config.js`.
316+
// However, note that if the file cannot be parsed by static analysis, it will behave as false.
317+
"runes": false,
281318
/* -- Experimental Svelte Features -- */
282319
/* It may be changed or removed in minor versions without notice. */
283320
// Whether to parse the `generics` attribute.
@@ -292,20 +329,22 @@ For example in `.eslintrc.*`:
292329

293330
**_This is an experimental feature. It may be changed or removed in minor versions without notice._**
294331

295-
If you install Svelte v5 the parser will be able to parse runes, and will also be able to parse `*.js` and `*.ts` files.
332+
If you install Svelte v5 and turn on runes (`compilerOptions.runes` in `svelte.config.js` or `parserOptions.svelteFeatures.runes` in ESLint config is `true`), the parser will be able to parse runes, and will also be able to parse `*.js` and `*.ts` files.
296333

297334
When using this mode in an ESLint configuration, it is recommended to set it per file pattern as below.
298335

299336
For example in `eslint.config.js`:
300337

301338
```js
339+
import svelteConfig from "./svelte.config.js";
302340
export default [
303341
{
304342
files: ["**/*.svelte", "*.svelte"],
305343
languageOptions: {
306344
parser: svelteParser,
307345
parserOptions: {
308346
parser: "...",
347+
svelteConfig,
309348
/* ... */
310349
},
311350
},
@@ -315,6 +354,7 @@ export default [
315354
languageOptions: {
316355
parser: svelteParser,
317356
parserOptions: {
357+
svelteConfig,
318358
/* ... */
319359
},
320360
},
@@ -325,6 +365,7 @@ export default [
325365
parser: svelteParser,
326366
parserOptions: {
327367
parser: "...(ts parser)...",
368+
svelteConfig,
328369
/* ... */
329370
},
330371
},
@@ -342,13 +383,15 @@ For example in `.eslintrc.*`:
342383
"parser": "svelte-eslint-parser",
343384
"parserOptions": {
344385
"parser": "...",
386+
"svelteFeatures": { "runes": true },
345387
/* ... */
346388
},
347389
},
348390
{
349391
"files": ["*.svelte.js"],
350392
"parser": "svelte-eslint-parser",
351393
"parserOptions": {
394+
"svelteFeatures": { "runes": true },
352395
/* ... */
353396
},
354397
},
@@ -357,6 +400,7 @@ For example in `.eslintrc.*`:
357400
"parser": "svelte-eslint-parser",
358401
"parserOptions": {
359402
"parser": "...(ts parser)...",
403+
"svelteFeatures": { "runes": true },
360404
/* ... */
361405
},
362406
},

‎src/index.ts

+6-5
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,15 @@ import { KEYS } from "./visitor-keys";
44
import { ParseError } from "./errors";
55
export {
66
parseForESLint,
7-
StyleContext,
8-
StyleContextNoStyleElement,
9-
StyleContextParseError,
10-
StyleContextSuccess,
11-
StyleContextUnknownLang,
7+
type StyleContext,
8+
type StyleContextNoStyleElement,
9+
type StyleContextParseError,
10+
type StyleContextSuccess,
11+
type StyleContextUnknownLang,
1212
} from "./parser";
1313
export * as meta from "./meta";
1414
export { name } from "./meta";
15+
export type { SvelteConfig } from "./svelte-config";
1516

1617
export { AST, ParseError };
1718

‎src/parser/analyze-scope.ts

+21-17
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import type {
1010
import { addReference, addVariable, getScopeFromNode } from "../scope";
1111
import { addElementToSortedArray } from "../utils";
1212
import type { NormalizedParserOptions } from "./parser-options";
13+
import type { SvelteParseContext } from "./svelte-parse-context";
1314
/**
1415
* Analyze scope
1516
*/
@@ -160,6 +161,7 @@ export function analyzeStoreScope(scopeManager: ScopeManager): void {
160161
export function analyzePropsScope(
161162
body: SvelteScriptElement,
162163
scopeManager: ScopeManager,
164+
svelteParseContext: SvelteParseContext,
163165
): void {
164166
const moduleScope = scopeManager.scopes.find(
165167
(scope) => scope.type === "module",
@@ -187,23 +189,25 @@ export function analyzePropsScope(
187189
}
188190
}
189191
} else if (node.type === "VariableDeclaration") {
190-
// Process for Svelte v5 Runes props. e.g. `let { x = $bindable() } = $props()`;
191-
for (const decl of node.declarations) {
192-
if (
193-
decl.init?.type === "CallExpression" &&
194-
decl.init.callee.type === "Identifier" &&
195-
decl.init.callee.name === "$props" &&
196-
decl.id.type === "ObjectPattern"
197-
) {
198-
for (const pattern of extractPattern(decl.id)) {
199-
if (
200-
pattern.type === "AssignmentPattern" &&
201-
pattern.left.type === "Identifier" &&
202-
pattern.right.type === "CallExpression" &&
203-
pattern.right.callee.type === "Identifier" &&
204-
pattern.right.callee.name === "$bindable"
205-
) {
206-
addPropReference(pattern.left, moduleScope);
192+
if (svelteParseContext.runes) {
193+
// Process for Svelte v5 Runes props. e.g. `let { x = $bindable() } = $props()`;
194+
for (const decl of node.declarations) {
195+
if (
196+
decl.init?.type === "CallExpression" &&
197+
decl.init.callee.type === "Identifier" &&
198+
decl.init.callee.name === "$props" &&
199+
decl.id.type === "ObjectPattern"
200+
) {
201+
for (const pattern of extractPattern(decl.id)) {
202+
if (
203+
pattern.type === "AssignmentPattern" &&
204+
pattern.left.type === "Identifier" &&
205+
pattern.right.type === "CallExpression" &&
206+
pattern.right.callee.type === "Identifier" &&
207+
pattern.right.callee.name === "$bindable"
208+
) {
209+
addPropReference(pattern.left, moduleScope);
210+
}
207211
}
208212
}
209213
}

‎src/parser/globals.ts

+21-9
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { svelteVersion } from "./svelte-version";
1+
import type { SvelteParseContext } from "./svelte-parse-context";
22

3-
const globalsForSvelte4 = ["$$slots", "$$props", "$$restProps"] as const;
3+
const globalsForSvelte = ["$$slots", "$$props", "$$restProps"] as const;
44
export const globalsForRunes = [
55
"$state",
66
"$derived",
@@ -10,10 +10,22 @@ export const globalsForRunes = [
1010
"$inspect",
1111
"$host",
1212
] as const;
13-
const globalsForSvelte5 = [...globalsForSvelte4, ...globalsForRunes];
14-
export const globals = svelteVersion.gte(5)
15-
? globalsForSvelte5
16-
: globalsForSvelte4;
17-
export const globalsForSvelteScript = svelteVersion.gte(5)
18-
? globalsForRunes
19-
: [];
13+
type Global =
14+
| (typeof globalsForSvelte)[number]
15+
| (typeof globalsForRunes)[number];
16+
export function getGlobalsForSvelte(
17+
svelteParseContext: SvelteParseContext,
18+
): readonly Global[] {
19+
if (svelteParseContext.runes) {
20+
return [...globalsForSvelte, ...globalsForRunes];
21+
}
22+
return globalsForSvelte;
23+
}
24+
export function getGlobalsForSvelteScript(
25+
svelteParseContext: SvelteParseContext,
26+
): readonly Global[] {
27+
if (svelteParseContext.runes) {
28+
return globalsForRunes;
29+
}
30+
return [];
31+
}

0 commit comments

Comments
 (0)