enable dev mode for preview repl (#9393)

* enable dev mode for preview repl

* format

* also add dev mode toggle for compiler options

* whoops

Author: gtm-nayan

sites/svelte-5-preview/src/lib/Output/CompilerOptions.svelte

@@ -1,6 +1,7 @@
 <!-- svelte-ignore a11y-label-has-associated-control -->
 <script>
 	import { get_repl_context } from '$lib/context.js';
+	import Checkbox from '../Checkbox.svelte';
 
 	const { compile_options } = get_repl_context();
 </script>
@@ -16,6 +17,12 @@
 		<input id="server" type="radio" bind:group={$compile_options.generate} value="server" />
 		<label for="server"><span class="string">"server"</span>,</label>
 	</div>
+
+	<label class="option">
+		<span class="key">dev:</span>
+		<Checkbox bind:checked={$compile_options.dev} />
+		<span class="boolean">{$compile_options.dev}</span>,
+	</label>
 	});
 </div>
 

sites/svelte-5-preview/src/lib/Repl.svelte

@@ -76,7 +76,8 @@
 
 	/** @type {import('svelte/compiler').CompileOptions} */
 	const DEFAULT_COMPILE_OPTIONS = {
-		generate: 'client'
+		generate: 'client',
+		dev: false
 	};
 
 	/** @type {Map<string, import('@codemirror/state').EditorState>} */

sites/svelte-5-preview/src/lib/workers/bundler/index.js

@@ -387,7 +387,8 @@ async function get_bundle(uid, mode, cache, local_files_lookup) {
 			} else if (id.endsWith('.svelte')) {
 				result = svelte.compile(code, {
 					filename: name + '.svelte',
-					generate: 'client'
+					generate: 'client',
+					dev: true
 				});
 
 				if (result.css) {
@@ -400,7 +401,11 @@ async function get_bundle(uid, mode, cache, local_files_lookup) {
 				`.replace(/\t/g, '');
 				}
 			} else if (id.endsWith('.svelte.js')) {
-				result = svelte.compileModule(code, { filename: name + '.js', generate: 'client' });
+				result = svelte.compileModule(code, {
+					filename: name + '.js',
+					generate: 'client',
+					dev: true
+				});
 				if (!result) {
 					return null;
 				}
@@ -420,7 +425,7 @@ async function get_bundle(uid, mode, cache, local_files_lookup) {
 				warnings.push(warning);
 			});
 
-			/** @type {import('rollup').TransformResult} */
+			/** @type {import('@rollup/browser').TransformResult} */
 			const transform_result = {
 				code: result.js.code,
 				map: result.js.map

sites/svelte-5-preview/src/lib/workers/compiler/index.js

@@ -59,7 +59,8 @@ function compile({ id, source, options, return_ast }) {
 		if (options.filename.endsWith('.svelte')) {
 			const compiled = svelte.compile(source, {
 				filename: options.filename,
-				generate: options.generate
+				generate: options.generate,
+				dev: options.dev
 			});
 
 			const { js, css, warnings, metadata } = compiled;
@@ -77,7 +78,8 @@ function compile({ id, source, options, return_ast }) {
 		} else if (options.filename.endsWith('.svelte.js')) {
 			const compiled = svelte.compileModule(source, {
 				filename: options.filename,
-				generate: options.generate
+				generate: options.generate,
+				dev: options.dev
 			});
 
 			if (compiled) {

sites/svelte-5-preview/src/lib/workers/jsconfig.json

@@ -0,0 +1,9 @@
+{
+	"include": ["./**/*"],
+	"compilerOptions": {
+		"paths": {
+			"svelte": ["../../../static/svelte/main"],
+			"svelte/*": ["../../../static/svelte/*"]
+		}
+	}
+}