critters
critters copied to clipboard
`pruneSource: true` not pruning files
Hey guys :)
I am having trouble, I think I could be missing something very simple. I'm not sure if this is a bug, but using the pruneSource
config item doesn't seem to do anything.
I was tinkering around with a critters astro plugin, astro-critters to inline critical CSS output from astro
.
After a while I decided to cut out the plugin middleman and just work directly with the compiled files and a simple .mjs
script so I could see what interactions critters took with the index.html
and the CSS file.
Here is the following script setup:
import Critters from "critters";
import fs from "fs";
const critters = new Critters({
path: "./dist",
logLevel: "debug",
pruneSource: true,
});
const file = fs.readFileSync("./dist/index.html", "utf-8");
const inlined = await critters.process(file);
fs.writeFileSync(inlined);
The inlining is working just fine. Approximately 50% of the CSS asset is inlined, however, the CSS asset remains unchanged at ~10kB.
# Shell Output
Inlined 5.72 kB (56% of original 10.1 kB) of assets/dd377348.be9e9362.css.
At least from the documentation, it is not clear to me if the CSS asset is automatically overwritten with pruneSource: true
, or if extra work is necessary on my end to achieve this.
astro-plugin
aside - am I missing some sort of configuration when working with critters
bare-metal like this to get the CSS asset to be modified? :) Is there a method exposed from the critters
class I could use?
Thanks for any insight or help!