From 20d98a53db1b035fe70f9d4f981e5b616d884568 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Wed, 4 Sep 2024 18:30:22 +0100 Subject: [PATCH 1/2] fix: revert #13048 --- .changeset/proud-lobsters-lie.md | 5 +++ .../3-transform/client/transform-client.js | 2 +- .../_expected/client/index.svelte.js | 33 ------------------- .../_expected/server/index.svelte.js | 12 ------- .../samples/inline-module-vars/index.svelte | 17 ---------- 5 files changed, 6 insertions(+), 63 deletions(-) create mode 100644 .changeset/proud-lobsters-lie.md delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte diff --git a/.changeset/proud-lobsters-lie.md b/.changeset/proud-lobsters-lie.md new file mode 100644 index 000000000000..1c62290089bb --- /dev/null +++ b/.changeset/proud-lobsters-lie.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: revert #13048, leave instance-scope imports above other statements 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 index 967bd849ccb1..13fd241e0c8e 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js @@ -457,7 +457,7 @@ export function client_component(analysis, options) { analysis.uses_slots || analysis.slot_names.size > 0; - const body = [...module.body, ...state.hoisted]; + const body = [...state.hoisted, ...module.body]; const component = b.function_declaration( b.id(analysis.name), diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js deleted file mode 100644 index 8776c5c09573..000000000000 --- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js +++ /dev/null @@ -1,33 +0,0 @@ -import "svelte/internal/disclose-version"; - -const __ENHANCED_IMG_1__ = "__VITE_ASSET__2AM7_y_a__"; -const __ENHANCED_IMG_2__ = "__VITE_ASSET__2AM7_y_b__"; -const __ENHANCED_IMG_3__ = "__VITE_ASSET__2AM7_y_c__"; -const __ENHANCED_IMG_4__ = "__VITE_ASSET__2AM7_y_d__"; -const __ENHANCED_IMG_5__ = "__VITE_ASSET__2AM7_y_e__"; -const __ENHANCED_IMG_6__ = "__VITE_ASSET__2AM7_y_f__"; - -import * as $ from "svelte/internal/client"; - -var root = $.template(` production test`); - -export default function Inline_module_vars($$anchor) { - var picture = root(); - var source = $.child(picture); - - $.set_attribute(source, "srcset", __ENHANCED_IMG_1__ + " 1440w, " + __ENHANCED_IMG_2__ + " 960w"); - - var source_1 = $.sibling(source, 2); - - $.set_attribute(source_1, "srcset", __ENHANCED_IMG_3__ + " 1440w, " + __ENHANCED_IMG_4__ + " 960w"); - - var source_2 = $.sibling(source_1, 2); - - $.set_attribute(source_2, "srcset", __ENHANCED_IMG_5__ + " 1440w, " + __ENHANCED_IMG_6__ + " 960w"); - - var img = $.sibling(source_2, 2); - - $.set_attribute(img, "src", __ENHANCED_IMG_5__); - $.reset(picture); - $.append($$anchor, picture); -} \ No newline at end of file diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js deleted file mode 100644 index 5542d125732a..000000000000 --- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js +++ /dev/null @@ -1,12 +0,0 @@ -import * as $ from "svelte/internal/server"; - -const __ENHANCED_IMG_1__ = "__VITE_ASSET__2AM7_y_a__"; -const __ENHANCED_IMG_2__ = "__VITE_ASSET__2AM7_y_b__"; -const __ENHANCED_IMG_3__ = "__VITE_ASSET__2AM7_y_c__"; -const __ENHANCED_IMG_4__ = "__VITE_ASSET__2AM7_y_d__"; -const __ENHANCED_IMG_5__ = "__VITE_ASSET__2AM7_y_e__"; -const __ENHANCED_IMG_6__ = "__VITE_ASSET__2AM7_y_f__"; - -export default function Inline_module_vars($$payload) { - $$payload.out += ` `; -} \ No newline at end of file diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte b/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte deleted file mode 100644 index 7a792f80ad12..000000000000 --- a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte +++ /dev/null @@ -1,17 +0,0 @@ - - - - - - - - - production test - From 6f81a986acabfcc87010a8cc3501db663cb74a93 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Thu, 5 Sep 2024 14:03:29 +0200 Subject: [PATCH 2/2] preserve import order and fix regression --- .changeset/proud-lobsters-lie.md | 2 +- .../3-transform/client/transform-client.js | 17 ++++++++++++++++- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/.changeset/proud-lobsters-lie.md b/.changeset/proud-lobsters-lie.md index 1c62290089bb..b797c935c570 100644 --- a/.changeset/proud-lobsters-lie.md +++ b/.changeset/proud-lobsters-lie.md @@ -2,4 +2,4 @@ 'svelte': patch --- -fix: revert #13048, leave instance-scope imports above other statements +fix: Ensure imports are above other statements 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 index 13fd241e0c8e..690cdb43454f 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js @@ -457,7 +457,22 @@ export function client_component(analysis, options) { analysis.uses_slots || analysis.slot_names.size > 0; - const body = [...state.hoisted, ...module.body]; + // Merge hoisted statements into module body. + // Ensure imports are on top, with the order preserved, then module body, then hoisted statements + /** @type {ESTree.ImportDeclaration[]} */ + const imports = []; + /** @type {ESTree.Program['body']} */ + let body = []; + + for (const entry of [...module.body, ...state.hoisted]) { + if (entry.type === 'ImportDeclaration') { + imports.push(entry); + } else { + body.push(entry); + } + } + + body = [...imports, ...body]; const component = b.function_declaration( b.id(analysis.name),