Our great sponsors
-
wouter — a minimalist-friendly 1.3KB routing solution for React and Preact
-
omgopass — a tiny 0.3 KB and ultra-fast memorable password generator (600 times faster than password-generator)
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
The entirety of react-colorful costs about 2 KB, but installing emotion would make the size of the package almost 7 times bigger. Of course, there are tiny CSS-in-JS libraries like goober that cost about 1KB, but we didn't feel like we need the entire library since our styles are not dynamic.
-
Most bundlers, Microbundle included, save processed styles to the disk as a CSS file. Because we wanted to have the styles in JS, we asked Jason Miller, the author of Microbundle (amongst many other notable projects), to provide us with a way to import processed CSS as a string into JavaScript and he generously added a new option to Microbundle:
-
-
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
It seemed like a good solution, but we've started receiving complaints from many developers that were unable to use the styles. It is quite common in the React ecosystem to use libraries like Emotion, Styled-Components, or other CSS-in-JS libraries exclusively and to entirely forgo the inclusion of a style loader. As such, usage of react-colorful would necessitate the alteration of build configurations for these users to be able to access the default styling.
Related posts
- npm ERR! Cannot read properties of null (reading 'edgesOut') | Error when installing a package on a reactjs project
- Does it make sense to use new NextJS with UI libraries if I have to put "use client" on top of every page in src/app to make CSS-in-JS work and can't use server components?
- What's Your Preferred CSS-in-JS Styling Method?
- Need some help
- How To Use The Next.js Link Component (with Examples)