esbuild import css as a string

Question

I am using vite to build a component library. I use css?inline like this

import otherStyles from './bar.css?inline' // will be available as a string

And use the string to construct stylesheets in the component. see here

Now I made a build script with esbuild. But can't seem to get this inline css to work. Esbuild parses the import but makes an external css.

I know vite (dev env) is based on esbuild, so it should be possible to let esbuild do inline css parsing. Can't find it in the docs, can't find a plugin that does this either.

Answer 1

https://github.com/claviska/esbuild-plugin-inline-import

Usage:

import string from 'inline:./path/to/file.ext';

f.e.

import cssCode from 'inline:./path/to/style.css';