Import CSS files

[AnsgarH1]

Hi there, im trying to use jsx-email to generate emails in a given corporate design. The current design system is built around styled-components, but also exports css classes for legacy use cases. What is the best case to approach building templates here? I tried importing the css file provided by an internal module, but throws an error and doesn't seem to be the right approach.

Is there a simple way to include plain css files or any styling solutions other than tailwind?

[shellscape]

Probably! I'd love to see a reproduction that showed the approach that isn't working? Might help me to get a better perspective on what you're going for.

[AnsgarH1]

I built a simple demo of how i expected it to work: https://github.com/AnsgarH1/jsx-mail-css-demo/tree/main

When running a build or preview, I always get the same error:

TypeError: Unknown file extension ".css" for /private/var/folders/vj/kt61jh5510qdsr5x36t_qfh40000gn/T/jsx-email/build/email-LOAGP6VY.css
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:218:9)
    at defaultGetFormat (node:internal/modules/esm/get_format:244:36)
    at defaultLoad (node:internal/modules/esm/load:122:22)
    at ModuleLoader.load (node:internal/modules/esm/loader:570:7)
    at ModuleLoader.moduleProvider (node:internal/modules/esm/loader:443:45)
    at ModuleJob._link (node:internal/modules/esm/module_job:106:19)

[shellscape]

Thanks, I'll play with this tonight.

[shellscape]

OK we've got a bunch of options for making this happen. Will be working on something concrete.

[shellscape]

Here's where I'm at on this, this evening. Note the import cssText from './static/test.css' and the results in the preview app, line 101 in the JSX, and line 11 in the HTML:

[shellscape]

I'm investigating returning a component from an import as well. the TypeScript typing is a bit tricky

[shellscape]

For now, #244

[shellscape]

This has been merged, docs have been updated, and will be available in a few minutes.

[AnsgarH1]

Hey sorry, for the late reply. Thanks for the implementation, i could build a small proof of concept for our client!

Happy holidays!