richardtallent / vite-plugin-singlefile

Vite plugin for inlining JavaScript and CSS resources
MIT License
808 stars 53 forks source link

CSS files with a `@charset` rule are not inlined correctly #90

Closed andreashuber69 closed 7 months ago

andreashuber69 commented 7 months ago

In my source html file I'm referencing Pico.css, as follows:

<link rel="stylesheet" href="./node_modules/@picocss/pico/css/pico.min.css">

When I then build my project with vite build, this plugin inlines the contents of pico.min.css verbatim into a <style> tag in the built html file, as follows:

  <style>
@charset "UTF-8";/*!
* Pico CSS v1.5.11 (https://picocss.com)
* Copyright 2019-2023 - Licensed under MIT

The @charset "UTF-8"; bit is not valid in a HTML file. This happens with both the cssMinify: false and cssMinify: "esbuild" build options.

As a workaround, I now spectify cssMinify: "lightningcss", which removes the mentioned @charset rule.

richardtallent commented 7 months ago

Should be resolved now in v2.0

andreashuber69 commented 7 months ago

Should be resolved now in v2.0

Works as expected, thank you!