Describe the bug

I'm currently converting a large web app from create-react-app to Vite. Our SCSS framework uses variable width & weight fonts, which are imported using url() in SCSS. We need to provide these fonts as static assets in our project, since our users often use it in environments without an internet connection to fetch webfonts with.

The font file names contain square brackets [ for the weight and width to be injected into. However, using square brackets in the import string results in incorrect font file names in the build output, where the square brackets are replaced with underscores. So, our framework replaces the brackets with percent-encoded characters - %5B for [, and %5D for ]. However, Vite/Rollup does not decode these while building, and the font imports do not resolve.

Reproduction

https://stackblitz.com/edit/vitejs-vite-tsnz33?file=style.css

Steps to reproduce

Using the provided link:

1. Run npm run build
2. Observe error about a .woff2 file not resolving at build time
3. In style.css, comment out line 6 and uncomment line 7
4. Run npm run build
5. Observe font file being produced, where underscores replace the square brackets

System Info

System:
    OS: Linux 6.5 Ubuntu 23.10 23.10 (Mantic Minotaur)
    CPU: (24) x64 AMD Ryzen 9 3900X 12-Core Processor
    Memory: 17.39 GB / 31.26 GB
    Container: Yes
    Shell: 5.2.15 - /bin/bash
  Binaries:
    Node: 20.9.0 - ~/.nvm/versions/node/v20.9.0/bin/node
    Yarn: 1.22.21 - ~/.nvm/versions/node/v20.9.0/bin/yarn
    npm: 10.1.0 - ~/.nvm/versions/node/v20.9.0/bin/npm
  Browsers:
    Chrome: 119.0.6045.105
  npmPackages:
    @vitejs/plugin-react-swc: 3.4.1 => 3.4.1 
    vite: 4.5.0 => 4.5.0

Used Package Manager

yarn

Logs

❯ npm run build --debug

> [email protected] build
> vite build

vite v5.0.2 building for production...
transforming (1) index.html
/fonts/f1ea362b-Ubuntu%5Bwdth,wght%5D-latin-v0.896a.woff2 referenced in /home/projects/vitejs-vite-tsnz33/style.css didn't resolve at build time, it will remain unchanged to be resolved at runtime
✓ 7 modules transformed.
dist/index.html                 0.45 kB │ gzip: 0.30 kB
dist/assets/index-GZD-3WAI.css  1.36 kB │ gzip: 0.70 kB
dist/assets/index-5_-lRlrZ.js   2.59 kB │ gzip: 1.38 kB
✓ built in 783ms

❯ npm run build --debug

> [email protected] build
> vite build

vite v5.0.2 building for production...
✓ 7 modules transformed.
dist/index.html                                                       0.45 kB │ gzip: 0.29 kB
dist/assets/f1ea362b-Ubuntu_wdth_wght_-latin-v0.896a-b_Xgw9oJ.woff2  95.13 kB
dist/assets/index-CccUqCrK.css                                        1.37 kB │ gzip: 0.70 kB
dist/assets/index-UuEVhJ86.js                                         2.59 kB │ gzip: 1.38 kB
✓ built in 759ms

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.