...for those wanting to see more — you can see CSS being used in this example compiledcssinjs.com/docs/api…

Create styles that can be re-used between components with "CSS", now available. + @​compiled/[email protected] ✨ + @​compiled/[email protected] ✨ compiledcssinjs.com/docs/api…

Can you tell the difference between these two images? 👇🤔 No? Well, we'd hope not! Left = styles in JS 🎂 Right = styles extracted to CSS 🌋 compiledcssinjs.com landing page now with extracted styles. #cssinjs #react #webdev

If you're interested in trying something new why not give the library a try! We're interested in hearing your feedback as well as any bugs you've found during use. 👉 npm i @​compiled/react @​compiled/webpack-loader ALL THE BEST!! ❤️❤️🎉

And most importantly, styles from node modules are extracted (and stripped) as well! Import a component from your favorite component library or design system, and it's extracted! HOW AWESOME IS THAT!?

Finally, styles are extracted to a static style sheet. It's currently extracted to a single style sheet, but we're planning on enabling code split styles later on.

Next, the runtime is stripped away. This is most noticeable when looking through React DevTools! It's ALL removed!

This is one of the features we've been most excited to implement. Let's talk about what it all means! Style your components exactly as you've done before. The APIs, style composition, conditional styles, it's all there! Nothing needs to change, even when extracting your styles.

Experimental style extraction now available for Webpack 5! Try it today. ✅ Extract styles from your app ✅ Extract styles from node modules ✅ Atomic style sheet ✅ Style sheet minification compiledcssinjs.com/docs/css… 🧵👇 #javascript #cssinjs #reactjs #webdev #css #programming