Why is cssHash generated for my library?

[Enes5519]

Describe the bug

Since I can't pass scoped css to child components in Svelte, I use preprocess to do this. When I migrated to Svelte 5, I thought there was a problem when I saw svelte-{hash} classnames in my snapshots. When I printed the cssHash function, it wrote the path of my library.

Reproduction

1. Create project with svelte 5.
2. Use svelte-preprocess-cssmodules in your project.
3. Create library with svelte 4.
4. Use svelte-preprocess-cssmodules in your library.
5. Use your created library in your created project.
6. You can see svelte prefixed classes.

Logs

Css Hash output (filename and css props)

/Users/.../my-project/.../ContentCard.svelte :global(.container) {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
:global(.container.horizontal) {
  flex-direction: row;
}
:global(.container.horizontal .sizes) {
  flex: 1;
}

:global(.separator) {
  height: 1px;
  background-color: var(--bl-color-neutral-lighter);
  display: none;
}
:global(.separator:has(+ *)) {
  display: block;
}
:global(.separator.horizontal) {
  height: auto;
  width: 1px;
}

/Users/X/my-project/node_modules/my-library/dist/.../Box.svelte 
  :global(.box-XSmnzi) {
    padding: var(--box-padding);
    border-radius: var(--top-border-radius) var(--top-border-radius) var(--bottom-border-radius)
      var(--bottom-border-radius);
    background: white;
  }

  :global(.box-XSmnzi > [data-remove-margin]) {
    margin-left: calc(var(--box-padding) * -1);
    margin-right: calc(var(--box-padding) * -1);
  }

System Info

System:
    OS: macOS 15.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 179.03 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.18.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 9.4.0 - /usr/local/bin/pnpm
    bun: 1.1.17 - ~/.bun/bin/bun
    Watchman: 2024.12.02.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 132.0.6834.160
    Safari: 18.2
  npmPackages:
    @sveltejs/vite-plugin-svelte: ^4.0.0 => 4.0.4 
    svelte: ^5.0.0 => 5.19.1 
    svelte-preprocess-cssmodules: ^3.0.0 => 3.0.0 
    vite: ^5.4.10 => 5.4.10

Severity

annoyance

[Ocean-OS]

This reproduction is way too vague, please provide a cloneable GitHub repository or a REPL reproduction.

[Enes5519]

Is it normal for the library to enter the compiler css hash function?

[webJose]

I think this is expected. Component libraries are not compiled. They are simply transpiled out of their TypeScript (if used), and source code is packaged. When a project consumes them, they are compiled, and part of the process is to scope the CSS.

However, this is just my thinking. It would be ideal to provide actual reproductions of the issue.

[Enes5519]

You are right. But I cannot offer reproduction, it is actually something that can be looked at more locally. My main question is that it was not generating hashes before when I used the preprocessor I mentioned. Why is it generating now?

[dominikg]

without a reproduction repo (in this case i suggest 2 branches that showcase the different behavior in svelte4 and svelte5) it is impossible for us to tell. Us trying to reproduce it from your description would be time consuming and error prone.

So if you believe this behavior to be a bug in svelte5, please provide one. If not and this is a more of a question, we can either convert this to a discussion or you ask about it on https://svelte.dev/chat in #questions-svelte-and-kit