Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Background image path not transformed when used in a shared CSS module #15410

Open
7 tasks done
arty-name opened this issue Dec 22, 2023 · 1 comment
Open
7 tasks done
Labels
bug: upstream Bug in a dependency of Vite feat: css p3-minor-bug An edge case that only affects very specific usage (priority)

Comments

@arty-name
Copy link

Describe the bug

I am using Vite indirectly through Astro. I have a shared CSS module and compose its declarations in other CSS modules. When I link to a background image in this shared module, its URL remains unchanged in the output CSS, and doesn’t work. When I move the same background rule to a non-shared CSS module, everything works as expected: the URL of the background image is transformed to link to its actual location.

I reported this originally for Astro and received the recommendation to create an issue for Vite. This is likely related to madyankin/postcss-modules#149.

Reproduction

https://stackblitz.com/edit/github-dzmctt-mda7ss?file=src%2Fcomponents%2Fa.module.css

Steps to reproduce

By default the StackBlitz shows the working version. To see the bug, comment out the background definition in a.module.css, and uncomment it in shared.module.css. You might need to restart Astro in the terminal by focusing it, pressing Ctrl+C, and running astro dev.

System Info

System:
    OS: Linux 6.5 Ubuntu 23.10 23.10 (Mantic Minotaur)
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
    Memory: 11.12 GB / 31.13 GB
    Container: Yes
    Shell: 3.6.1 - /usr/bin/fish
  Binaries:
    Node: 20.10.0 - /usr/bin/node
    Yarn: 4.0.2 - /usr/bin/yarn
    npm: 10.2.3 - /usr/bin/npm
  Browsers:
    Chrome: 120.0.6099.129

Used Package Manager

yarn

Logs

No response

Validations

Copy link

stackblitz bot commented Dec 22, 2023

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.

@bluwy bluwy added bug: upstream Bug in a dependency of Vite feat: css p3-minor-bug An edge case that only affects very specific usage (priority) and removed pending triage labels Dec 23, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug: upstream Bug in a dependency of Vite feat: css p3-minor-bug An edge case that only affects very specific usage (priority)
Projects
None yet
Development

No branches or pull requests

2 participants