Create documentation section for using TypeScript with Storybook

[danielduan]

If you are creating a issue to track work to be completed, start here:

Work summary

There is a decent amount of config needed for TypeScript to work within Storybook. We should document the TS definitions, scripts, configs, etc. needed to get all the features working.

Where to start

A new page within /docs is probably the best way to go.

Acceptance criteria

• Installing TS Add proper typescript webpack setup in readme #1778
• Using TS with addons such as Info Addons info and Typescript props docgen? #1519
• Running Storybook with TS compilation
• Any other tips

Who to contact

I personally don't use TS but it is a widely requested topic within our GitHub issues.

[tsiq-swyx]

i'll give this a crack next week

edit: am getting approval to do this on company time, gimme a few days

[igor-dv]

Probably it is time to add a label for TypeScript.

[estaub]

@tsiq-swyx, Here's some grist:

• https://medium.com/@mtiller/storybook-react-typescript-and-jest-c9059ea06fa7 (I successfully* just used this as a guide; I'm a storybook noob)
• http://www.joshschreuder.me/react-storybooks-with-typescript/

*successfully: I'm on webpack 4, using the 4-compatible version of awesome-typescript-loader, which breaks on webpack 3, which is used in storybook 3. Everything (so far) works fine with storybook 4.0.0-alpha.1. I'd definitely include a webpack version caveat.

[tsiq-swyx]

appreciated! taking surprisingly long to get company approval, but def keen to get started on this.

…

On Fri, Mar 30, 2018 at 11:18 AM, Ed Staub ***@***.***> wrote: @tsiq-swyx <https://github.com/tsiq-swyx>, Here's some grist: - ***@***.***/storybook-react-typescript- and-jest-c9059ea06fa7 (I successfully* just used this as a guide; I'm a storybook noob) - http://www.joshschreuder.me/react-storybooks-with-typescript/ *successfully: I'm on webpack 4, using the 4-compatible version of awesome-typescript-loader, which breaks on webpack 3, which is used in storybook 3. Everything (so far) works fine with storybook 4.0.0-alpha.1. I'd definitely include a webpack version caveat. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3270 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AiT1ghPcsDg5UqQO8g2OWAVEg8ChkWFQks5tjkzBgaJpZM4S5N-b> .

[tsiq-swyx]

Hi friends,

I am going to start work on this now. Appreciate the wait.

[tsiq-swyx]

Going to document how to get it to look a bit nicer too like this:

[lukepighetti]

Any chance we can get a storybook installer that follows up https://github.com/Microsoft/TypeScript-React-Starter ? I'm not looking forward to setting up Storybook with my typescript react project the first time around.