MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Reactではスタイルシートをファイルのまま使うよりも、JavaScriptからスタイル要素に直接指定する方法が好まれます。ただ、その際に問題になるのは通常のスタイルシートと書き方が全く異なるということでしょう。 数年前まではデザイナーとエンジニアの作業分担が言われていたのですが、Reactではうまくいきません。そこで代替手段としてnative-cssを使ってみましょう。 native-cssの使い方 native-cssは以下のようにスタイルシートを指定して実行します。 $ native-css input.css output.js --react 元々のスタイルシートは次のようになっていたとします。 .taxi { background-color: #F8F8F8; col
![native-css - スタイルシートをReact用オブジェクトに変換](https://cdn-ak-scissors.b.st-hatena.com/image/square/5b77db804c69b51b3167dd1e1ade43bf4e33b573/height=288;version=1;width=512/https%3A%2F%2Fmoongift-assets.s3.amazonaws.com%2Fassets%2Fnone-c3f80f5acd8206a735bb12db1e77cb6d.png)