Any way to use external css files?

[JRJurman]

I'm trying to export an svg with multiple variants, all driven with external css files. I've tried using the following config but was not able to get it to work.

[
  {
    "input": ["./src/logo.svg"],
    "output": [
      ["./dist/color_1024x1024.png", "pad", "1024:1024"],
      ["./dist/black_1024x1024.png", "pad", "1024:1024", "@import \"./src/black.css\";"]
    ]
  }
]

I ended up adding src {} so that the css matcher would catch the import line (otherwise the parameter isn't considered css).

["./dist/black_1024x1024.png", "pad", "1024:1024", "@import \"./src/black.css\"; src{}"]

I cloned the project, and modified it to write the html files local (which would be an awesome debugging option). Either way, I can see the html files getting the css injected, and the css being applied, but where puppeteer lives / runs must have not have access to the files because the exported svg doesn't have the styles. I ended up hosting the files using npx serve and using the @import url syntax

["./dist/black_1024x1024.png", "pad", "1024:1024", "@import url(\"http://localhost:5000/black.css\"); svg{}"]

This ended up working, but I don't really want to start a webserver to generate variants of this svg. Any insights on how I can get puppeteer to see my css files with a local file system import?