Christiana, this is such a crisp and clean guide. Thank you!
Thank you! I would be glad to see an article about "Create React Library" with typescript
Thank you so much !! this is what I am looking for so long 👍
I haven't used Storybook before so, I definitely learned a lot from this article.
Amazing article, Cristiana Man. Thanks for sharing.
Helpful! Planning to build a component library of popups!
Thanks for the guide Cristiana! I just went through this dance myself and here are some additional things I found interesting:
npm packto test out what's getting placed in your published package. Also, it lets younpm i path/to/tarbal-0-0-0.tgzto verify. Much more reliable then pure npm linking on both sides.typescript({ declaration: true, }),and in my tsconfig
"noEmit": false, "emitDeclarationOnly": true,and then use
tscto build the types with:"build:types": "tsc -p tsconfig.json && tsc -p tsconfig-cjs.json",where my
tsconfig-cjs.jsonextended the main one just changing themoduletoCommonJSandoutDirtodist/cjs. It seemsdistis most popular default e.g. for create-react-app akareact-scriptsit seems to "want" stuff indist(I had put stuff inlibbefore).It's probably worth experimenting with the
postcssoptions:postcss({ minimize: true, sourceMap: true, extract: true, }),I wanted my css minimized and not inlined. I thought I'd need to add
module: truebut there's a default inpostcssthat if you already name your filesfoo.module.cssit'll treat it as a CSS module anyway (of course this is only for folks who care about that).All this was done for my AgnosticUI React package (but similar for Vue and Svelte packages too)
I definitely took a lot of tweaking and I referenced many other blog articles and docs before getting it to my liking. Thanks again for yours Cristiana!