storybook ã TypeScript ã§åãã
React Storybook ãčŠĻã
TL;DR
- react-storybook 㯠component ㎠styleguide
- TypeScript ãŽãžãžã§ã¯åãããĒããŽã§ä¸åēĻããĢãããīŧ2016/09 įžå¨īŧ
- addon æĄåŧĩã§éįēãäžŋåŠãĢãĒãã¨ãŗãˇãšãã ã¯ãã
- éä¸įĩé
storybook
stories
add
ããĻä¸čϧããŧã¸ããĢã¸ãĨãĸãĢãĢäŊæã§ããgh-pages
ãĒãŠã§į°ĄåãĢããšãã§ããHMR
ãã§ãããŽã¯ããããã- ãããã watch ããããĒã
webpack
ãĢãŠãŖãˇãäžå
TypeScript with React
- 2016 åš´ 9 æįžå¨ã 㨠React ãĸããĒ㎠TypeScript æĄį¨ã¯ææå°æŠ
- įĸēããĢįžįļãŽååŽįžŠã¯å¤ã
- ãžã ããã§å°ããģ㊠React äŊŋãããĒããĻããĒã
- įˇŠãåãäŋĄãããģå°ãŖããčããīŧåäēēã§ã¯īŧ
tsx
- ãĩããŧãããããã
- DOM ãåäģãã§åŽįžŠã§ãããã¨ãŽåŽåŋæ
- ããšããæ¸ããŽã¯æčéĢããĢãĒãåŋ čĻããã
- äžŋåŠã ããŠé ã
webpack
- å¤ã loader ãåĸããĻãã ex.
ts-loader
ts-loader
ãĒãŠã§ watch ã¯ã§ããĒããŽã§tsc -w
ã§æ§åãčĻã- ãŦãããĒäžåããįįĩåãĢã§ããã¨ããã¯įįĩåãĢãã
- å¤ã loader ãåĸããĻãã ex.
CSS-module
- åēæŦįãĢäŊŋããĒãæšãč¯ããã
- äŊŋãå ´åã¯æ§é å css ã¨ããĻč˛ãĻããŽã§ã¯ãĒãã
local
css ã¨ããĻããĢããããģããč¯ããã- SDK ãĒãŠã§åŠį¨ãããŽã¯ãĸãĒ
Refs
react-storybook ãį¨ãã React ãŗãŗããŧããŗãéįē