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

CSS iconfont unicode content converted with vite 4.3.* #13676

Closed
7 tasks done
X-W-W opened this issue Jun 29, 2023 · 2 comments
Closed
7 tasks done

CSS iconfont unicode content converted with vite 4.3.* #13676

X-W-W opened this issue Jun 29, 2023 · 2 comments
Labels
wontfix This will not be worked on

Comments

@X-W-W
Copy link

X-W-W commented Jun 29, 2023

Describe the bug

bundle and minify code with vite 4.3.*

original css code:
.icon-icon_cross2:before{content:"\ea0f"}
minified:
.icon-icon_cross2:before{content:""}

Using both esbuild and terser, all reproduced.

Casing problem:
Browser loads icon incorrect occasionally like this.
image

Temporarily Fix:
import cssnanoPlugin from 'cssnano';
build.cssMinify:false
css: {
postcss:{
plugins:[
cssnanoPlugin()
]
}
},

Reproduction

https://stackblitz.com/edit/vitejs-vite-xjsuvd

Steps to reproduce

npm run build
check dist/assets/index.css

then go to
vite.config.js
uncomment
// minify: false
run and check again
see the diffs

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.20.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
    pnpm: 8.6.3 - /usr/local/bin/pnpm
  npmPackages:
    vite: ^4.3.9 => 4.3.9

Used Package Manager

npm

Logs

No response

Validations

@stackblitz
Copy link

stackblitz bot commented Jun 29, 2023

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

@sapphi-red
Copy link
Member

This is expected.

In Vite 4.0, we changed the default charset to UTF-8 (#10753). But there was a bug that this was not applied to CSS (#12565); this fix landed in 4.3.0.
Since Vite 4, we expects users to setup the server configuration correctly (not to set other char set in Content-Type or <meta charset="">).

If you really want to convert the result to ASCII only, you can use esbuild.charset: 'ascii' option.

@sapphi-red sapphi-red added wontfix This will not be worked on and removed pending triage labels Jun 29, 2023
@github-actions github-actions bot locked and limited conversation to collaborators Jul 14, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
wontfix This will not be worked on
Projects
None yet
Development

No branches or pull requests

2 participants