@rsvelte/vite-plugin-svelte 0.5.1 → 0.5.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsvelte/vite-plugin-svelte",
-  "version": "0.5.1",
+  "version": "0.5.3",
   "license": "MIT",
   "author": "dominikg",
   "files": [
@@ -36,13 +36,13 @@
   "dependencies": {
     "@jridgewell/remapping": "^2.3.5",
     "@jridgewell/trace-mapping": "^0.3.31",
+    "@rsvelte/vite-plugin-svelte-native": "^0.3.14",
     "@sveltejs/vite-plugin-svelte-inspector": "^5.0.0",
     "acorn": "^8.16.0",
     "deepmerge": "^4.3.1",
     "magic-string": "^1.0.0",
-    "obug": "^2.1.0",
-    "vitefu": "^1.1.1",
-    "@rsvelte/vite-plugin-svelte-native": "^0.3.7"
+    "obug": "^3.0.0",
+    "vitefu": "^1.1.1"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",
@@ -51,10 +51,12 @@
   "devDependencies": {
     "@types/debug": "^4.1.12",
     "sass": "^1.94.2",
-    "svelte": "^5.56.4",
-    "vite": "^8.0.0"
+    "svelte": "5.57.0",
+    "vite": "^8.0.0",
+    "vitest": "^5.0.0"
   },
   "scripts": {
+    "test": "vitest run",
     "check:publint": "publint --strict",
     "check:types": "tsc --noEmit",
     "generate:types": "dts-buddy -m \"@rsvelte/vite-plugin-svelte:src/public.d.ts\""

package/src/utils/compile.js

@@ -1,9 +1,7 @@
 import * as svelte from '@rsvelte/vite-plugin-svelte-native';
 import { safeBase64Hash } from './hash.js';
 import { log } from './log.js';
-import { addPartialAcceptExports, applyMapEdits } from './map-edits.js';
-
-import { mapToRelative } from './sourcemaps.js';
+import { postprocessCompiled } from './map-edits.js';
 import { enhanceCompileError } from './error.js';
 
 // TODO this is a patched version of https://github.com/sveltejs/vite-plugin-svelte/pull/796/files#diff-3bce0b33034aad4b35ca094893671f7e7ddf4d27254ae7b9b0f912027a001b15R10
@@ -105,17 +103,6 @@ export function createCompileSvelte() {
 				typeof finalCompileOptions.cssHash === 'function'
 					? await svelte.compileAsync(finalCode, { ...finalCompileOptions, filename })
 					: svelte.compile(finalCode, { ...finalCompileOptions, filename });
-
-			// patch output with partial accept until svelte does it
-			// TODO remove later
-			if (
-				options.server?.config.experimental.hmrPartialAccept &&
-				compiled.js.code.includes('import.meta.hot')
-			) {
-				applyMapEdits(compiled, filename, (editor, generated) => {
-					addPartialAcceptExports(editor, generated);
-				});
-			}
 		} catch (e) {
 			enhanceCompileError(e, code, options.preprocess);
 			throw e;
@@ -124,24 +111,21 @@ export function createCompileSvelte() {
 		if (endStat) {
 			endStat();
 		}
-		mapToRelative(compiled.js?.map, filename);
-		mapToRelative(compiled.css?.map, filename);
 		if (warnings.length) {
 			if (!compiled.warnings) {
 				compiled.warnings = [];
 			}
 			compiled.warnings.push(...warnings);
 		}
-		if (!raw) {
-			// wire css import and code for hmr
-			const hasCss = compiled.css?.code?.trim()?.length ?? 0 > 0;
-			// compiler might not emit css with mode none or it may be empty
-			if (emitCss && hasCss) {
-				applyMapEdits(compiled, filename, (editor) => {
-					editor.append(`\nimport ${JSON.stringify(cssId)};\n`);
-				});
-			}
-		}
+		// compiler might not emit css with mode none or it may be empty
+		const hasCss = compiled.css?.code?.trim()?.length ?? 0 > 0;
+		postprocessCompiled(compiled, {
+			filename,
+			cssId,
+			// patch output with partial accept until svelte does it
+			partialAccept: !!options.server?.config.experimental.hmrPartialAccept,
+			emitCssImport: !raw && emitCss && hasCss
+		});
 
 		let lang = 'js';
 		for (const match of code.matchAll(scriptLangRE)) {

package/src/utils/map-edits.js

@@ -1,6 +1,12 @@
 import remapping from '@jridgewell/remapping';
 import { parse } from 'acorn';
 import MagicString from 'magic-string';
+import { mapToRelative } from './sourcemaps.js';
+
+// remapping resolves a loaded map's sources against the URI of the source it
+// replaces, so a name with a directory component would rewrite relative sources
+// into absolute ones. A bare name leaves every spelling untouched.
+const PRE_EDIT_SOURCE = 'rsvelte-pre-edit-source';
 
 /** @param {any} callee */
 function isHotAcceptCallee(callee) {
@@ -39,22 +45,48 @@ function collectHotAcceptCalls(node, calls) {
 
 /**
  * @param {{ js: { code: string, map: any } }} compiled
- * @param {string} filename
  * @param {(editor: MagicString, code: string) => void} edit
  */
-export function applyMapEdits(compiled, filename, edit) {
+export function applyMapEdits(compiled, edit) {
 	const editor = new MagicString(compiled.js.code);
 	edit(editor, compiled.js.code);
 	const previousMap = compiled.js.map;
 	compiled.js.code = editor.toString();
 	if (!previousMap) return;
-	const editMap = editor.generateMap({ hires: true, source: filename });
+	const editMap = editor.generateMap({ hires: true, source: PRE_EDIT_SOURCE });
 	let loadedPreviousMap = false;
-	compiled.js.map = remapping(/** @type {any} */ (editMap), (source) => {
-		if (source !== filename || loadedPreviousMap) return null;
+	const composed = remapping(/** @type {any} */ (editMap), (source) => {
+		if (source !== PRE_EDIT_SOURCE || loadedPreviousMap) return null;
 		loadedPreviousMap = true;
 		return /** @type {any} */ (previousMap);
 	});
+	// the edit map carries no `file`, so composing would otherwise drop it
+	if (previousMap.file != null) {
+		/** @type {any} */ (composed).file = previousMap.file;
+	}
+	compiled.js.map = composed;
+}
+
+/**
+ * Rewrite the compiled JavaScript for the dev server — HMR partial accept and the
+ * emitted-CSS import — keeping `js.map` in step with every edit.
+ *
+ * @param {{ js: { code: string, map: any }, css?: { map?: any } | null }} compiled
+ * @param {{ filename: string, cssId: string, partialAccept: boolean, emitCssImport: boolean }} options
+ */
+export function postprocessCompiled(compiled, { filename, cssId, partialAccept, emitCssImport }) {
+	if (partialAccept && compiled.js.code.includes('import.meta.hot')) {
+		applyMapEdits(compiled, (editor, generated) => {
+			addPartialAcceptExports(editor, generated);
+		});
+	}
+	mapToRelative(compiled.js?.map, filename);
+	mapToRelative(compiled.css?.map, filename);
+	if (emitCssImport) {
+		applyMapEdits(compiled, (editor) => {
+			editor.append(`\nimport ${JSON.stringify(cssId)};\n`);
+		});
+	}
 }
 
 /**