Skip to content

[Bug]: File encoded as UTF-8 with BOM makes output file invalid #9461

@jparkrr

Description

@jparkrr

System Info

System:
OS: macOS 15.3.1
CPU: (8) arm64 Apple M1
Memory: 334.39 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 22.13.1 - ~/.asdf/installs/nodejs/22.13.1/bin/node
npm: 10.9.2 - ~/.asdf/installs/nodejs/22.13.1/bin/npm
pnpm: 9.15.2 - /opt/homebrew/bin/pnpm
bun: 1.2.1 - /opt/homebrew/bin/bun
Watchman: 2024.12.02.00 - /Users/justin/code/custom-watchman/Cellar/watchman/2024.12.02.00_1/bin/watchman
Browsers:
Chrome: 133.0.6943.127
Safari: 18.3
npmPackages:
@rspack/cli: ^1.2.6 => 1.2.6
@rspack/core: ^1.2.6 => 1.2.6

Details

I guess this is/was an issue with webpack as well, but it didn't happen for me when I was using webpack webpack/webpack#13642

One of my dependencies has a css file encoded as UTF-8 with BOM. This causes Chrome to not be able to fully parse the CSS that is output in development mode.

Image

Note that in my actual project, the file with the incorrect UTF-8 BOM encoding is in one of my dependencies so it's not easy for me to re-encode it.

Reproduce link

https://github.com/jparkrr/bom-bug-rspack-repo

Reproduce Steps

  1. Clone repo https://github.com/jparkrr/bom-bug-rspack-repo
  2. pnpm run dev:rspack
  3. See that the css rule isn't being applied to make the text blue.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions