fix: ignore non-entry-point CSS files during inlining (#13395)

fixes #13068 (comment)

Author: dummdidumm

.changeset/shaggy-ravens-unite.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: ignore non-entry-point CSS files during inlining

packages/kit/src/exports/vite/build/build_server.js

@@ -47,7 +47,12 @@ export function build_server_nodes(out, kit, manifest_data, server_manifest, cli
 		css.filter(asset => client_stylesheets.has(asset.fileName))
 			.forEach((asset) => {
 				if (asset.source.length < kit.inlineStyleThreshold) {
+					// We know that the names for entry points are numbers.
 					const [index] = basename(asset.fileName).split('.');
+					// There can also be other CSS files from shared components
+					// for example, which we need to ignore here.
+					if (isNaN(+index)) return;
+
 					const server_stylesheet = server_stylesheets.get(+index);
 					const file = `${out}/server/stylesheets/${index}.js`;
 

packages/kit/test/apps/options/source/components/SharedCSS.svelte

@@ -0,0 +1,9 @@
+<p>
+	This component is imported in multiple pages and therefore its CSS lands in a separate CSS chunk
+</p>
+
+<style>
+	p {
+		color: blue;
+	}
+</style>

packages/kit/test/apps/options/source/pages/inline-assets/+page.svelte

@@ -1,8 +1,13 @@
 <script>
+	import SharedCSS from '$lib/SharedCSS.svelte';
 	import '@fontsource/libre-barcode-128-text';
 </script>
 
-<p>Hello world!</p>
+<p>
+	Test that the fontsource is referenced correctly, while the shared CSS in SharedCSS doesn't cause
+	problems
+</p>
+<SharedCSS />
 
 <style>
 	p {

packages/kit/test/apps/options/source/pages/resolve-route/+page.svelte

@@ -1,5 +1,7 @@
 <script>
 	import { resolveRoute } from '$app/paths';
+	import SharedCss from '$lib/SharedCSS.svelte';
 </script>
 
+<SharedCss />
 <a data-id="target" href={resolveRoute('/resolve-route/[foo]', { foo: 'resolved' })}>click me</a>