InlineStyleThreshold not working after migrating to svelte 5

[keshavdhawan281]

Describe the bug

In sveltekit.config.ts

`

kit: {
	adapter: adapter({
		precompress: true
	}),
	files: {
		serviceWorker: 'src/sw.ts'
	},
	serviceWorker: {
		register: false
	},
	paths: {
		base: '/mutual-funds'
	},
	alias: {
		'lib/': './src/routes/lib/',
		$components: './src/lib/components',
		$auth: './src/routes/(app)/(authenticated)'
	},
	version: {
		name: pkg.version
	},
	inlineStyleThreshold: 10240
}

};`

inlineStyleThreshold is added.

Added error log on running build post migration to svelte 5.
After removing inlineStyleThreshold, inline css is not working properly and multiple css chunks have becoming render blocking.

Is inlineStyleThreshold not supported in svelte 5?

Reproduction

NA

Logs

[vite-plugin-sveltekit-compile] ENOENT: no such file or directory, open '/Users/abc/Documents/work/abc/.svelte-kit/output/server/undefined'
at Object.readFileSync (node:fs:448:20)
at file:///Users/abc/Documents/work/mf-ui/node_modules/.pnpm/@sveltejs+kit@2.16.1_@sveltejs+vite-plugin-svelte@4.0.4_svelte@5.20.5_vite@5.4.14_@types+node_rjotf6hzx2a3oagmy52esqfxau/node_modules/@sveltejs/kit/src/exports/vite/build/build_server.js:56:24
at Array.forEach ()
at build_server_nodes (file:///Users/abc/Documents/work/abc/node_modules/.pnpm/@sveltejs+kit@2.16.1_@sveltejs+vite-plugin-svelte@4.0.4_svelte@5.20.5_vite@5.4.14_@types+node_rjotf6hzx2a3oagmy52esqfxau/node_modules/@sveltejs/kit/src/exports/vite/build/build_server.js:48:5)
at Object.handler (file:///Users/abc/Documents/work/mf-ui/node_modules/.pnpm/@sveltejs+kit@2.16.1_@sveltejs+vite-plugin-svelte@4.0.4_svelte@5.20.5_vite@5.4.14_@types+node_rjotf6hzx2a3oagmy52esqfxau/node_modules/@sveltejs/kit/src/exports/vite/index.js:919:5)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async PluginDriver.hookParallel (file:///Users/abc/Documents/work/abcnode_modules/.pnpm/rollup@4.30.1/node_modules/rollup/dist/es/shared/node-entry.js:20858:17)
at async file:///Users/abc/Documents/work/mf-ui/node_modules/.pnpm/rollup@4.30.1/node_modules/rollup/dist/es/shared/node-entry.js:21907:13
at async catchUnfinishedHookActions (file:///Users/abc/Documents/work/abc/node_modules/.pnpm/rollup@4.30.1/node_modules/rollup/dist/es/shared/node-entry.js:21282:16)
at async build (file:///Users/abc/Documents/work/abc/node_modules/.pnpm/vite@5.4.14_@types+node@22.10.5_terser@5.37.0/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:65607:16)

System Info

NA

Severity

annoyance

[paoloricciuti]

This issue should probably be on vite-plugin-svelte but most importantly we need a reproduction

cc. @dominikg can you move it there?

[keshavdhawan281]

@paoloricciuti I was able to resolve build error by updating sveltekit and svelte to latest version. But inlineStyleThreshold doesn't seem to work. Is it not supported in svelte 5?

[dominikg]

looking at https://stackblitz.com/edit/sveltejs-kit-template-default-tglvq4xg?file=svelte.config.js,build%2Findex.html

it seems the styles are inlined (run npm run build and check build/index.html) but also added as link blocks with attributes that should prevent them from getting loaded

		<link href="./_app/immutable/assets/0.DSX17XxN.css" rel="stylesheet" disabled media="(max-width: 0)">
		<link href="./_app/immutable/assets/2.sTI-GHXi.css" rel="stylesheet" disabled media="(max-width: 0)">

not entirely sure why these links exist in the output

[keshavdhawan281]

@paoloricciuti @dominikg Refer to https://stackblitz.com/edit/sveltejs-kit-template-default-ethyrdbh

In case where components are rendered using dynamic import, css specified in those components are not getting inlined. LazyComponent is getting dynamically imported during SSR. But it is created as a separate css chunk instead of being inlined with other css.

[dominikg]

please do not tag individual maintainers. Your initial report did not mention dynamic imports. Are you sure this worked in svelte4?

[keshavdhawan281]

Yes, we recently realised that issue is caused by dynamic import. This is coming since this PR in sveltekit
sveltejs/kit#13068

Dynamic imports are not considered for inlining. But this should be considered if imported dynamically during SSR.

[keshavdhawan281]

Added issue for sveltekit repo - sveltejs/kit#13670

[dominikg]

see sveltejs/kit#13670