DEV Community

Discussion on: Build your First Typescript Package in Under 10 Minutes

Collapse
 
mattpocockuk profile image
Matt Pocock

Would importing the css files as a require('./index.css') mean you'd need a custom webpack config on the other end to pull it through? Not sure if that require would resolve when you used the package. Unsure though, not tried it out myself.

Collapse
 
g_abud profile image
Gabriel Abud

You were right about that, it didn't work correctly when you pulled it from npm. I added the postcss plugin to the tutorial and now it should work as expected. Thanks for the heads up!

Collapse
 
mattpocockuk profile image
Matt Pocock

Nice, good stuff.

Collapse
 
g_abud profile image
Gabriel Abud • Edited

I think not using require actually would require a custom rollup plugin from the look of it. When using ESM type imports for CSS I get an error, but maybe I'm missing something?

Something like: github.com/thgh/rollup-plugin-css-.... I'm kind of a noob with Rollup though, more familiar with Webpack and CRA. If there's a better way to do this without having to install a plugin I'm all ears.

Collapse
 
mattpocockuk profile image
Matt Pocock

Styled-components would support this natively, I think. That should be fairly easy to drop in to your code examples above. Or a similar css-in-js solution.

Either that, or you'd need to allow users to import the CSS file directly, similar to how react-toastify handles it.

What's the error you're getting? A TS error or a Rollup error? (I am also pretty clueless with rollup, also a CRA boi)

Thread Thread
 
g_abud profile image
Gabriel Abud

When running npm start:

✖ Failed to compile
Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)