sveltejs
svelte-package hangs after finish
Describe the bug
If you forget to edit svelte.config.js, changing vitePreprocess() to sveltePreprocess({scss: true}), svelte-package will hang forever after printing src\lib -> dist.
Reproduction
I've created a repo from sv create that followed the steps below (except, of course, I didn't update svelte.config.js since that exhibits the problem).
Steps to reproduce:
sv create svelte-sasshang
cd svelte-sasshang
pnpm up
Add src/lib/Foo.svelte (note the lang="scss")
<script>
let { foo } = $props();
</script>
<div> {foo} </div>
<style lang="scss">
div { color: red; }
</style>
run
pnpm build
build gives a helpful error messag:
> Preprocessor dependency "sass-embedded" not found. Did you install it? Try `pnpm add -D sass-embedded`.
at loadPreprocessorPath (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:48754:13)
at loadSassPackage (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:48769:19)
at process (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:49034:27)
at compileCSSPreprocessors (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:48168:34)
at compileCSS (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:48226:38)
at async preprocessCSS (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-yUJfKD1i.js:48451:10)
at async style (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/vite-plugin-svelte/src/preprocess.js:77:31)
at async process_single_tag (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/svelte/src/compiler/preprocess/index.js:283:21)
at async Promise.all (index 0)
at async replace_in_code (file:///C:/srv/work/svelte-sasshang/node_modules/.pnpm/[email protected]/node_modules/svelte/src/compiler/preprocess/replace_in_code.js:70:23)
ELIFECYCLE Command failed with exit code 1.
add sass-embedded:
pnpm add -D sass-embedded
run pnpm build again.
svelte-package hangs forever.
> [email protected] package
> svelte-kit sync && svelte-package && publint
If bundling, conditions should include development or production. If not bundling, conditions or NODE_ENV should include development or production. See https://www.npmjs.com/package/esm-env for tips on setting conditions in popular bundlers and runtimes.
src\lib -> dist
The problem is that you need to change svelte.config.js:
import adapter from '@sveltejs/adapter-auto';
- import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
+ import { sveltePreprocess } from 'svelte-preprocess';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://svelte.dev/docs/kit/integrations
// for more information about preprocessors
- preprocess: vitePreprocess(),
+ preprocess: sveltePreprocess({scss: true}),
...
Logs
see above
System Info
System:
OS: Windows 11 10.0.22631
CPU: (48) x64 AMD Ryzen Threadripper 3960X 24-Core Processor
Memory: 32.29 GB / 63.88 GB
Binaries:
Node: 22.6.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.21 - ~\AppData\Roaming\npm\yarn.CMD
npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
pnpm: 9.14.4 - ~\AppData\Local\pnpm\pnpm.CMD
bun: 1.1.8 - ~\AppData\Roaming\npm\bun.CMD
Browsers:
Edge: Chromium (127.0.2651.74)
Internet Explorer: 11.0.22621.3527
npmPackages:
@sveltejs/adapter-auto: ^3.3.1 => 3.3.1
@sveltejs/kit: ^2.9.0 => 2.9.0
@sveltejs/package: ^2.3.7 => 2.3.7
@sveltejs/vite-plugin-svelte: ^5.0.1 => 5.0.1
svelte: ^5.9.0 => 5.9.0
vite: ^6.0.3 => 6.0.3
Severity
annoyance
Additional Information
It would be great if it gave an error message instead of hanging (it was very difficult to isolate).
If sv could add scss and take care of such things it would be super-cool ;-)
What I have noticed is that killing dart.exe releases the block. Sass is now using Dart for their executables.
