DEV Community

Discussion on: What is the best way to distribute styles with npm package?

Collapse
 
thekashey profile image
Anton Korzunov

It depends on SSR. Without SSR it it could be a simple inject-style-tag solution, like react-style-singleton.

With SSR it become complex.

  • first your styles might be become bound to the users environment, like CSSModules for .css
  • next you might affect the users environment, like shipping SC4 while user has SC2

So - I would say - CSS. CSS with a webpack-loader of you choice, or node-loader to do the same, like css-modules-require-hook. It's just keeps a bit more freedom for everyone.

Collapse
 
stereobooster profile image
stereobooster

react-style-singleton is interesting I need to play with it. I didn't quite get the idea behind css-modules-require-hook, what the value there

Collapse
 
thekashey profile image
Anton Korzunov

css-modules-require-hook is just a good example of a node-loader. Like - you may process source CSS and transform to the thing you need, like you may do using webpack-loader.
Almost nobody consider this as an option, or calling some loader-based approaches bad, cos they are not repeatable for node, while they are :)

Thread Thread
 
andreynovikovrelef profile image
Andrey Novikov • Edited

What about babel-plugin-transform-postcss? I think this is better than css-modules-require-hook, because postcss and postcss-modules are used directly. And no CSS is actually included in the resulting JavaScript

Thread Thread
 
thekashey profile image
Anton Korzunov

A very good option