`npm run package` stucks when there's a component with `<style lang="sass">`
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 20.8k
- Forks
- 2.3k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 156
Description
Describe the bug
I try to npm run package, and it stucks if there are components in /src/lib that contains <style lang="sass">:
PS D:\tools\ui> npm run package
> @anfr/ui@1.0.0 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
If I remove all the components with sass style tag, it gets built. For example, if we leave just Box.svelte and Text.svelte which don't have sass styles inside.
If there is a <style> tag (without lang attribute), it gets built.
// svelte.config.js
import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://svelte.dev/docs/kit/integrations
// for more information about preprocessors
preprocess: vitePreprocess(),
kit: {
// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
// See https://svelte.dev/docs/kit/adapters for more information about adapters.
adapter: adapter()
}
};
export default config;
// vite.config.ts
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [sveltekit()],
});
The package.json content:
{
"name": "@anfr/ui",
"version": "1.0.0",
"description": "The Svelte component library for Anafro tools",
"keywords": [
"svelte",
"svelte-components",
"svelte-component-library",
"ui",
"ui-components",
"anafro",
"anafro-tools"
],
"homepage": "https://github.com/anafro/ui",
"author": {
"name": "Anatoly Frolov",
"email": "anatolyfroloff@gmail.com",
"url": "https://anafro.ru"
},
"scripts": {
"dev": "vite dev",
"build": "vite build && npm run package",
"preview": "vite preview",
"package": "svelte-kit sync && svelte-package && publint",
"prepublishOnly": "npm run package",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
},
"files": [
"dist",
"!dist/**/*.test.*",
"!dist/**/*.spec.*"
],
"sideEffects": [
"**/*.css"
],
"svelte": "./dist/index.js",
"types": "./dist/index.d.ts",
"type": "module",
"exports": {
".": {
"types": "./dist/index.d.ts",
"svelte": "./dist/index.js"
}
},
"peerDependencies": {
"svelte": "^5.0.0"
},
"devDependencies": {
"@sveltejs/adapter-auto": "^3.3.1",
"@sveltejs/kit": "^2.11.1",
"@sveltejs/package": "^2.3.7",
"@sveltejs/vite-plugin-svelte": "^5.0.2",
"publint": "^0.2.12",
"sass-embedded": "^1.83.0",
"svelte": "^5.12.0",
"svelte-check": "^4.1.1",
"typescript": "^5.7.2",
"vite": "^6.0.3"
},
"dependencies": {
"npm-check-updates": "^17.1.11",
"svelte-preprocess-sass": "^2.0.1"
}
}
Reproduction
Logs
(none)
System Info
System:
OS: Windows 11 10.0.22631
CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
Memory: 1.01 GB / 7.88 GB
Binaries:
Node: 20.16.0 - C:\Program Files\nodejs\node.EXE
npm: 10.8.1 - C:\Program Files\nodejs\npm.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.11.1 => 2.11.1
@sveltejs/package: ^2.3.7 => 2.3.7
@sveltejs/vite-plugin-svelte: ^5.0.2 => 5.0.2
svelte: ^5.12.0 => 5.12.0
vite: ^6.0.3 => 6.0.3
Severity
blocking all usage of SvelteKit
Additional Information
(none)
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing npm run package in the linked repository with and without the <style lang="sass"> components, then inspect svelte.config.js, vite.config.ts, and package.json. The issue is complete when packaging finishes successfully while Sass-styled components remain present, without hanging.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, sass, typescript
- Domain
- build-system, tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100