fix: Svelte module resolution tweaks (#2481)

Svelte files are now resolved by intercepting checks for .d.svelte.ts instead of .svelte.ts. As a consequence, we can handle sibling foo.svelte / foo.svelte.ts files and importing both. When doing import Foo from './foo.svelte this now resolves to the Svelte file (prio to #2463 it would resovle to the .svelte.ts file), and doing import Foo from './foo.svelte.js will resolve to the TS file.

Author: dummdidumm

packages/language-server/.gitignore

@@ -1,3 +1,4 @@
 dist/
 .vscode/
 node_modules/
+!test/plugins/typescript/features/diagnostics/fixtures/exports-map-svelte/node_modules/

packages/language-server/package.json

@@ -10,7 +10,7 @@
         "./bin/server.js": "./bin/server.js"
     },
     "scripts": {
-        "test": "cross-env TS_NODE_TRANSPILE_ONLY=true mocha --require ts-node/register \"test/**/*.ts\" --exclude \"test/**/*.d.ts\"",
+        "test": "cross-env TS_NODE_TRANSPILE_ONLY=true mocha --require ts-node/register \"test/**/*.test.ts\"",
         "build": "tsc",
         "prepublishOnly": "npm run build",
         "watch": "tsc -w"

packages/language-server/src/plugins/typescript/module-loader.ts

@@ -104,7 +104,7 @@ class ImpliedNodeFormatResolver {
             return undefined;
         }
 
-        let mode = undefined;
+        let mode: ReturnType<typeof ts.getModeForResolutionAtIndex> = undefined;
         if (sourceFile) {
             this.cacheImpliedNodeFormat(sourceFile, compilerOptions);
             mode = ts.getModeForResolutionAtIndex(sourceFile, importIdxInFile, compilerOptions);

packages/language-server/src/plugins/typescript/svelte-sys.ts

@@ -11,6 +11,17 @@ export function createSvelteSys(tsSystem: ts.System) {
     function svelteFileExists(path: string) {
         if (isVirtualSvelteFilePath(path)) {
             const sveltePath = toRealSvelteFilePath(path);
+
+            // First check if there's a `.svelte.d.ts` or `.d.svelte.ts` file, which should take precedence
+            const dtsPath = sveltePath.slice(0, -7) + '.svelte.d.ts';
+            const dtsPathExists = fileExistsCache.get(dtsPath) ?? tsSystem.fileExists(dtsPath);
+            fileExistsCache.set(dtsPath, dtsPathExists);
+            if (dtsPathExists) return false;
+
+            const svelteDtsPathExists = fileExistsCache.get(path) ?? tsSystem.fileExists(path);
+            fileExistsCache.set(path, svelteDtsPathExists);
+            if (svelteDtsPathExists) return false;
+
             const sveltePathExists =
                 fileExistsCache.get(sveltePath) ?? tsSystem.fileExists(sveltePath);
             fileExistsCache.set(sveltePath, sveltePathExists);
@@ -33,10 +44,11 @@ export function createSvelteSys(tsSystem: ts.System) {
         svelteFileExists,
         getRealSveltePathIfExists,
         fileExists(path: string) {
-            // We need to check both .svelte and .svelte.ts/js because that's how Svelte 5 will likely mark files with runes in them
+            // We need to check if this is a virtual svelte file
             const sveltePathExists = svelteFileExists(path);
-            const exists =
-                sveltePathExists || (fileExistsCache.get(path) ?? tsSystem.fileExists(path));
+            if (sveltePathExists) return true;
+
+            const exists = fileExistsCache.get(path) ?? tsSystem.fileExists(path);
             fileExistsCache.set(path, exists);
             return exists;
         },
@@ -66,7 +78,7 @@ export function createSvelteSys(tsSystem: ts.System) {
         const realpath = tsSystem.realpath;
         svelteSys.realpath = function (path) {
             if (svelteFileExists(path)) {
-                return realpath(toRealSvelteFilePath(path)) + '.ts';
+                return realpath(toRealSvelteFilePath(path));
             }
             return realpath(path);
         };

packages/language-server/src/plugins/typescript/utils.ts

@@ -70,15 +70,17 @@ export function isSvelteFilePath(filePath: string) {
 }
 
 export function isVirtualSvelteFilePath(filePath: string) {
-    return filePath.endsWith('.svelte.ts');
+    return filePath.endsWith('.d.svelte.ts');
 }
 
 export function toRealSvelteFilePath(filePath: string) {
-    return filePath.slice(0, -'.ts'.length);
+    return filePath.slice(0, -11 /* 'd.svelte.ts'.length */) + 'svelte';
 }
 
-export function toVirtualSvelteFilePath(filePath: string) {
-    return filePath.endsWith('.ts') ? filePath : filePath + '.ts';
+export function toVirtualSvelteFilePath(svelteFilePath: string) {
+    return isVirtualSvelteFilePath(svelteFilePath)
+        ? svelteFilePath
+        : svelteFilePath.slice(0, -6 /* 'svelte'.length */) + 'd.svelte.ts';
 }
 
 export function ensureRealSvelteFilePath(filePath: string) {

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/bindings-two-way-check/expectedv2.json

@@ -0,0 +1,18 @@
+[
+    {
+        "code": -1,
+        "message": "Unexpected token",
+        "range": {
+            "end": {
+                "character": 47,
+                "line": 12
+            },
+            "start": {
+                "character": 47,
+                "line": 12
+            }
+        },
+        "severity": 1,
+        "source": "ts"
+    }
+]

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/exports-map-svelte/expectedv2.json

@@ -0,0 +1,36 @@
+[
+    {
+        "code": 2307,
+        "message": "Cannot find module 'package' or its corresponding type declarations.",
+        "range": {
+            "end": {
+                "character": 45,
+                "line": 1
+            },
+            "start": {
+                "character": 36,
+                "line": 1
+            }
+        },
+        "severity": 1,
+        "source": "ts",
+        "tags": []
+    },
+    {
+        "code": 2307,
+        "message": "Cannot find module 'package/y' or its corresponding type declarations.",
+        "range": {
+            "start": {
+                "character": 38,
+                "line": 3
+            },
+            "end": {
+                "character": 49,
+                "line": 3
+            }
+        },
+        "severity": 1,
+        "source": "ts",
+        "tags": []
+    }
+]

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/exports-map-svelte/input.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+    import DefaultSvelteWithTS from 'package'; // with https://github.com/sveltejs/language-tools/pull/2478 this would work; needs decision if we want that
+    import SubWithDTS from 'package/x';
+    import SubWithoutDTSAndNotTS from 'package/y';
+</script>
+
+<DefaultSvelteWithTS />
+<SubWithDTS />
+<SubWithoutDTSAndNotTS />