emotionの初歩的な使用に関するメモ
書き方から見ると、侵入性は小さく、直接classNameです.
import styled, { css } from 'react-emotion';
const Container = styled('div')`
background: #333;
`
const myStyle = css`
color: rebeccapurple;
`
const app = () => (
Hello World
);
そして生成されたCSSはhashのclassNameに基づいて包まれ、
.
.
, CSS js CSS .
emotion babel plugin , Webpack :
https://github.com/emotion-js...
, .
demo , :
https://github.com/minimal-xy...
, CSS src/
の に されたもので、ソースコードと にいて、 し れていて、 の ろにxarg
と いたコマンドラインは にパッケージ で しました.
エディタのサポートについては、 VSコードを しています. のハイライトと ヒントが です.https://marketplace.visualstu...https://github.com/Microsoft/... のpluginはTypeScriptをローカルにインストールし、2.6.1
+に り える があります. は に しました.また、 にPrettierを わせるので、オートフォーマットもできます.
もう つの な はCSSのいくつかの / の であり、まだこれらの を く り げるのに ではない.おおよそ できる だと う. でStrikinglyが かち うのを つ...
CSS
する はissues で に ねて、emotionが したファイルに する について. に つの が つかったのは、 になってからスタイルが われたことだ.コードの 、 は、コードclassNameの がスタイルに しなくなり、 に するemotionがclassNameの に ってスタイルのマージを し、 は になりません.メンテナンスチームが したシナリオは されません... が できる はまあまあだと いますが...しかし、 は だった.