From b136ab8f7d36b6accb395ea7ee6fa939fd29c8bf Mon Sep 17 00:00:00 2001
From: Haruki Murasaki <54629159+purp1eeeee@users.noreply.github.com>
Date: Mon, 19 Jul 2021 23:47:55 +0900
Subject: [PATCH] Update typescript.md for main.ts

You need ts-node to make the configuration file .ts. I have spent a lot of time trying to figure this out. Therefore, I would like to add this change to the documentation.
---
 docs/configure/typescript.md | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/docs/configure/typescript.md b/docs/configure/typescript.md
index 353d8dda80e5..e86b7df407f3 100644
--- a/docs/configure/typescript.md
+++ b/docs/configure/typescript.md
@@ -18,6 +18,11 @@ Each framework uses the base configuration unless otherwise specified:
 
 To make it easier to configure Typescript handling, use the `typescript` field in your [`.storybook/main.js`](./overview.md#configure-story-rendering).
 
+<div class="aside">
+If you want the configration to be main.ts, you will need [ts-node](https://github.com/TypeStrong/ts-node) as a dependency.
+</div>
+
+
 The following code snippets shows the fields for you to use with TypeScript:
 
 <!-- prettier-ignore-start -->
@@ -61,4 +66,4 @@ Next time you restart your Storybook the extra props will also be in the UI.
 
 <div class="aside">
 If you run into an issue where the extra props aren't included, check how your component is being exported. If it's using a default export, change it to a named export and the extra props will be included as well.
-</div>
\ No newline at end of file
+</div>