{"repo":"SukkaW/stylex-webpack","free":true,"listed":false,"github":"https://github.com/SukkaW/stylex-webpack","clone":"git clone https://github.com/SukkaW/stylex-webpack.git","description":"The another webpack/Next.js Plugin for Facebook StyleX","language":"TypeScript","stars":31,"topics":["css-in-js","nextjs","stylex","webpack","webpack5"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"stylex-webpack First introduced by Frank Yan at React Conf 2020, StyleX framework agnostic CSS-in-JS system with near-zero runtime, ahead-of-time compiler, atomic CSS extraction that powers Facebook and Instagram. stylex-webpack is a webpack and Next.js plugin for StyleX. Motivation StyleX offers a CSS-in-JS compiler, allowing you to write CSS in your JavaScript/JSX/TSX. However, unlike other CSS-in-JS solutions that gather and process styles within the browser, StyleX will read your source code, collect your style and transform your JS/JSX/TSX, stripping runtime calls as much as possible (making the value of className a static string literal), and output the minimum required CSS elsewhere. StyleX does provide an official webpack plugin. Under the hood, it will traverse through the source code, collect styles, and emit a new CSS asset during the webpack compilation. However, it does come with some limitations: - StyleX's official Next.js setup requires a .babelrc file, which disables Next.js' built-in SWC compiler. - StyleX's official Next.js plugin requires a CSS asset to pre-exist so that it can append the extracted CSS to it. I start this project as a Proof of Concept, to see if it is possible to make a webpack plugin for StyleX that doesn't disable Next.js' SWC compiler. I have already made a similar webpack plugin for style9, which is also an AoT atomic CSS-in-JS system that is inspired by StyleX. Unlike StyleX's official webpack plugin, stylex-webpack requires you have ","default_branch":null,"files":null,"tree":[],"storefront":"/r/SukkaW","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/SukkaW/stylex-webpack/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}