thasmto https://blog.hatena.ne.jp/thasmto/ thasmto's blog https://thasmto.hatenablog.com/ はじめに 社内のプロジェクトでCSSinJSライブラ入りとしてemotionを導入したのでコーディングルールを考えてみました。 プロジェクトで使用する技術 package version next v11.1.2 typescript v4.4.3 @emotion/react v11.4.1 css関数を使ってスタイルを定義する emotionではstyle-componentと同様にスタイルを含むコンポーネントを作成するstyled関数と、コンポーネントと独立してスタイルを定義できるcss関数が用意されています。 css関数を使うことで従来のマークアップのようにHTMLとCSSを分別するこ… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fthasmto.hatenablog.com%2Fentry%2F2021%2F09%2F25%2F173328" title="Emotion コーディングルール案 - thasmto&#39;s blog" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/t/thasmto/20210925/20210925172742.png Hatena Blog https://hatena.blog 2021-09-25 17:33:28 rich https://thasmto.hatenablog.com/entry/2021/09/25/173328 1.0 100%