chore: directly export function in non-HMR mode (#11333)

Rich-Harris · dummdidumm · web-flow · commit 9a887f8dab8e · 2024-04-25T11:36:40.000-04:00
* chore: directly export function in non-HMR mode

* remove some more noise

* update snapshots

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

Co-authored-by: Simon H &lt;5968653+dummdidumm@users.noreply.github.com&gt;

---------

Co-authored-by: Simon H &lt;5968653+dummdidumm@users.noreply.github.com&gt;
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
@@ -430,18 +430,17 @@ export function client_component(source, analysis, options) {
 		component_block.body.unshift(b.const('$$slots', b.call('$.sanitize_slots', b.id('$$props'))));
 	}
 
-	const body = [
-		...state.hoisted,
-		...module.body,
-		b.function_declaration(
-			b.id(analysis.name),
-			[b.id('$$anchor'), b.id('$$props')],
-			component_block
-		)
-	];
+	const body = [...state.hoisted, ...module.body];
+
+	const component = b.function_declaration(
+		b.id(analysis.name),
+		[b.id('$$anchor'), b.id('$$props')],
+		component_block
+	);
 
 	if (options.hmr) {
 		body.push(
+			component,
 			b.if(
 				b.id('import.meta.hot'),
 				b.block([
@@ -459,12 +458,14 @@ export function client_component(source, analysis, options) {
 						)
 					)
 				])
-			)
+			),
+
+			b.export_default(b.id(analysis.name))
 		);
+	} else {
+		body.push(b.export_default(component));
 	}
 
-	body.push(b.export_default(b.id(analysis.name)));
-
 	if (options.dev) {
 		if (options.filename) {
 			let filename = options.filename;
diff --git a/packages/svelte/src/compiler/phases/3-transform/index.js b/packages/svelte/src/compiler/phases/3-transform/index.js
@@ -30,20 +30,6 @@ export function transform_component(analysis, source, options) {
 			? server_component(analysis, options)
 			: client_component(source, analysis, options);
 
-	const basename = (options.filename ?? 'Component').split(/[/\\]/).at(-1);
-	if (program.body.length > 0) {
-		program.body[0].leadingComments = [
-			{
-				type: 'Line',
-				value: ` ${basename} (Svelte v${VERSION})`
-			},
-			{
-				type: 'Line',
-				value: ' Note: compiler output will change before 5.0 is released!'
-			}
-		];
-	}
-
 	const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte');
 	const js = print(program, {
 		// include source content; makes it easier/more robust looking up the source map code
diff --git a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js
@@ -1,13 +1,11 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import TextInput from './Child.svelte';
 
 var root_1 = $.template(`Something`, 1);
 var root = $.template(`<!> `, 1);
 
-function Bind_component_snippet($$anchor, $$props) {
+export default function Bind_component_snippet($$anchor, $$props) {
 	$.push($$props, true);
 
 	let value = $.source('');
@@ -36,6 +34,4 @@ function Bind_component_snippet($$anchor, $$props) {
 	$.render_effect(() => $.set_text(text, ` value: ${$.stringify($.get(value))}`));
 	$.append($$anchor, fragment_1);
 	$.pop();
-}
-
-export default Bind_component_snippet;
+}
diff --git a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 import TextInput from './Child.svelte';
 
diff --git a/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js
@@ -1,9 +1,7 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-function Bind_this($$anchor, $$props) {
+export default function Bind_this($$anchor, $$props) {
 	$.push($$props, false);
 	$.init();
 
@@ -13,6 +11,4 @@ function Bind_this($$anchor, $$props) {
 	$.bind_this(Foo(node, {}), ($$value) => foo = $$value, () => foo);
 	$.append($$anchor, fragment);
 	$.pop();
-}
-
-export default Bind_this;
+}
diff --git a/packages/svelte/tests/snapshot/samples/bind-this/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-this/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Bind_this($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/class-state-field-constructor-assignment/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/class-state-field-constructor-assignment/_expected/client/index.svelte.js
@@ -1,9 +1,7 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-function Class_state_field_constructor_assignment($$anchor, $$props) {
+export default function Class_state_field_constructor_assignment($$anchor, $$props) {
 	$.push($$props, true);
 
 	class Foo {
@@ -26,6 +24,4 @@ function Class_state_field_constructor_assignment($$anchor, $$props) {
 	}
 
 	$.pop();
-}
-
-export default Class_state_field_constructor_assignment;
+}
diff --git a/packages/svelte/tests/snapshot/samples/class-state-field-constructor-assignment/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/class-state-field-constructor-assignment/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Class_state_field_constructor_assignment($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/client/main.svelte.js b/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/client/main.svelte.js
@@ -1,11 +1,9 @@
-// main.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
 var root = $.template(`<div></div> <svg></svg> <custom-element></custom-element> <div></div> <svg></svg> <custom-element></custom-element>`, 3);
 
-function Main($$anchor, $$props) {
+export default function Main($$anchor, $$props) {
 	$.push($$props, true);
 
 	// needs to be a snapshot test because jsdom does auto-correct the attribute casing
@@ -35,6 +33,4 @@ function Main($$anchor, $$props) {
 
 	$.append($$anchor, fragment);
 	$.pop();
-}
-
-export default Main;
+}
diff --git a/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js b/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js
@@ -1,5 +1,3 @@
-// main.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Main($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js
@@ -1,9 +1,7 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-function Each_string_template($$anchor, $$props) {
+export default function Each_string_template($$anchor, $$props) {
 	$.push($$props, false);
 	$.init();
 
@@ -19,6 +17,4 @@ function Each_string_template($$anchor, $$props) {
 
 	$.append($$anchor, fragment);
 	$.pop();
-}
-
-export default Each_string_template;
+}
diff --git a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Each_string_template($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/function-prop-no-getter/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/function-prop-no-getter/_expected/client/index.svelte.js
@@ -1,9 +1,7 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-function Function_prop_no_getter($$anchor, $$props) {
+export default function Function_prop_no_getter($$anchor, $$props) {
 	$.push($$props, true);
 
 	let count = $.source(0);
@@ -30,6 +28,4 @@ function Function_prop_no_getter($$anchor, $$props) {
 
 	$.append($$anchor, fragment);
 	$.pop();
-}
-
-export default Function_prop_no_getter;
+}
diff --git a/packages/svelte/tests/snapshot/samples/function-prop-no-getter/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/function-prop-no-getter/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Function_prop_no_getter($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js
@@ -1,18 +1,14 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
 var root = $.template(`<h1>hello world</h1>`);
 
-function Hello_world($$anchor, $$props) {
+export default function Hello_world($$anchor, $$props) {
 	$.push($$props, false);
 	$.init();
 
 	var h1 = root();
 
 	$.append($$anchor, h1);
 	$.pop();
-}
-
-export default Hello_world;
+}
diff --git a/packages/svelte/tests/snapshot/samples/hello-world/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/hello-world/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Hello_world($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
@@ -25,4 +23,4 @@ if (import.meta.hot) {
 	});
 }
 
-export default Hmr;
+export default Hmr;
diff --git a/packages/svelte/tests/snapshot/samples/hmr/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/hmr/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Hmr($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/client/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
@@ -12,7 +10,7 @@ function reset(_, str, tpl) {
 
 var root = $.template(`<input> <input> <button>reset</button>`, 1);
 
-function State_proxy_literal($$anchor, $$props) {
+export default function State_proxy_literal($$anchor, $$props) {
 	$.push($$props, true);
 
 	let str = $.source('');
@@ -35,6 +33,4 @@ function State_proxy_literal($$anchor, $$props) {
 	$.pop();
 }
 
-export default State_proxy_literal;
-
 $.delegate(["click"]);
diff --git a/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function State_proxy_literal($$payload, $$props) {
diff --git a/packages/svelte/tests/snapshot/samples/svelte-element/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/svelte-element/_expected/client/index.svelte.js
@@ -1,9 +1,7 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-function Svelte_element($$anchor, $$props) {
+export default function Svelte_element($$anchor, $$props) {
 	$.push($$props, true);
 
 	let tag = $.prop($$props, "tag", 3, 'hr');
@@ -13,6 +11,4 @@ function Svelte_element($$anchor, $$props) {
 	$.element(node, tag, false);
 	$.append($$anchor, fragment);
 	$.pop();
-}
-
-export default Svelte_element;
+}
diff --git a/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js
@@ -1,5 +1,3 @@
-// index.svelte (Svelte VERSION)
-// Note: compiler output will change before 5.0 is released!
 import * as $ from "svelte/internal/server";
 
 export default function Svelte_element($$payload, $$props) {
diff --git a/sites/svelte-5-preview/src/lib/workers/compiler/index.js b/sites/svelte-5-preview/src/lib/workers/compiler/index.js
@@ -59,7 +59,8 @@ function compile({ id, source, options, return_ast }) {
 			const compiled = svelte.compile(source, {
 				filename: options.filename,
 				generate: options.generate,
-				dev: options.dev
+				dev: options.dev,
+				discloseVersion: false // less visual noise in the output tab
 			});
 
 			const { js, css, warnings, metadata } = compiled;

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,3 @@`
`1`		`-// index.svelte (Svelte VERSION)`
`2`		`-// Note: compiler output will change before 5.0 is released!`
`3`	`1`	`import * as $ from "svelte/internal/server";`
`4`	`2`	`import TextInput from './Child.svelte';`
`5`	`3`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,3 @@`
`1`		`-// main.svelte (Svelte VERSION)`
`2`		`-// Note: compiler output will change before 5.0 is released!`
`3`	`1`	`import * as $ from "svelte/internal/server";`
`4`	`2`
`5`	`3`	`export default function Main($$payload, $$props) {`