From 051ddfd6f2442682da8b30dc107004cbc6d0ca61 Mon Sep 17 00:00:00 2001 From: tjallingt Date: Tue, 26 Feb 2019 10:52:19 +0100 Subject: [PATCH 1/5] Improve instructions for enabling typescript support These felt a bit lacking in detail --- docs/GettingStarted.md | 28 ++++++++++++++++++++++++++-- 1 file changed, 26 insertions(+), 2 deletions(-) diff --git a/docs/GettingStarted.md b/docs/GettingStarted.md index 57d64640527d..105f238ce47c 100644 --- a/docs/GettingStarted.md +++ b/docs/GettingStarted.md @@ -151,6 +151,30 @@ Jest can be used in projects that use [webpack](https://webpack.github.io/) to m ### Using TypeScript -Jest supports TypeScript out of the box, via Babel. +Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. +Next install the `@babel/preset-typescript` via `yarn`: -However, there are some caveats to using Typescript with Babel, see http://artsy.github.io/blog/2017/11/27/Babel-7-and-TypeScript/. Another caveat is that Jest will not typecheck your tests. If you want that, you can use [ts-jest](https://github.com/kulshekhar/ts-jest). +```bash +yarn add --dev @babel/preset-typescript +``` + +Then add `@babel/preset-typescript` to the list of presets in your `babel.config.js`. + +```javascript +// babel.config.js +module.exports = { + presets: [ + [ + '@babel/preset-env', + { + targets: { + node: 'current', + }, + }, + ], + '@babel/preset-typescript', + ], +}; +``` + +Note that there are some caveats to using Typescript with Babel, see http://artsy.github.io/blog/2017/11/27/Babel-7-and-TypeScript/. Another caveat is that Jest will not typecheck your tests. If you want that, you can use [ts-jest](https://github.com/kulshekhar/ts-jest). From 818e8ca44a2205553097b0d75915932f5a45abd9 Mon Sep 17 00:00:00 2001 From: tjallingt Date: Tue, 26 Feb 2019 16:04:54 +0100 Subject: [PATCH 2/5] reduce line count of example config --- docs/GettingStarted.md | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/docs/GettingStarted.md b/docs/GettingStarted.md index 105f238ce47c..d138a8ad612d 100644 --- a/docs/GettingStarted.md +++ b/docs/GettingStarted.md @@ -164,14 +164,7 @@ Then add `@babel/preset-typescript` to the list of presets in your `babel.config // babel.config.js module.exports = { presets: [ - [ - '@babel/preset-env', - { - targets: { - node: 'current', - }, - }, - ], + ['@babel/preset-env', {targets: {node: 'current'}}], '@babel/preset-typescript', ], }; From 6b66c5608a3dd3981ba78e32ee51d5d508bea634 Mon Sep 17 00:00:00 2001 From: tjallingt Date: Tue, 26 Feb 2019 16:08:26 +0100 Subject: [PATCH 3/5] Bring versioned docs in line with main docs --- .../version-24.0/GettingStarted.md | 21 +++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/website/versioned_docs/version-24.0/GettingStarted.md b/website/versioned_docs/version-24.0/GettingStarted.md index ae1d57d5a7f4..f24a08288b8e 100644 --- a/website/versioned_docs/version-24.0/GettingStarted.md +++ b/website/versioned_docs/version-24.0/GettingStarted.md @@ -152,6 +152,23 @@ Jest can be used in projects that use [webpack](https://webpack.github.io/) to m ### Using TypeScript -Jest supports TypeScript out of the box, via Babel. +Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. +Next install the `@babel/preset-typescript` via `yarn`: -However, there are some caveats to using Typescript with Babel, see http://artsy.github.io/blog/2017/11/27/Babel-7-and-TypeScript/. Another caveat is that Jest will not typecheck your tests. If you want that, you can use [ts-jest](https://github.com/kulshekhar/ts-jest). +```bash +yarn add --dev @babel/preset-typescript +``` + +Then add `@babel/preset-typescript` to the list of presets in your `babel.config.js`. + +```javascript +// babel.config.js +module.exports = { + presets: [ + ['@babel/preset-env', {targets: {node: 'current'}}], + '@babel/preset-typescript', + ], +}; +``` + +Note that there are some caveats to using Typescript with Babel, see http://artsy.github.io/blog/2017/11/27/Babel-7-and-TypeScript/. Another caveat is that Jest will not typecheck your tests. If you want that, you can use [ts-jest](https://github.com/kulshekhar/ts-jest). From 0e84a2593ee625bce7b621ba57941c0a1b0c4722 Mon Sep 17 00:00:00 2001 From: tjallingt Date: Tue, 26 Feb 2019 16:16:44 +0100 Subject: [PATCH 4/5] fix prettier --- docs/GettingStarted.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/GettingStarted.md b/docs/GettingStarted.md index d138a8ad612d..2da889c273a8 100644 --- a/docs/GettingStarted.md +++ b/docs/GettingStarted.md @@ -151,8 +151,7 @@ Jest can be used in projects that use [webpack](https://webpack.github.io/) to m ### Using TypeScript -Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. -Next install the `@babel/preset-typescript` via `yarn`: +Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. Next install the `@babel/preset-typescript` via `yarn`: ```bash yarn add --dev @babel/preset-typescript From 01246ee2f8bb939bad3545ac7796945e0a2f7bc7 Mon Sep 17 00:00:00 2001 From: tjallingt Date: Tue, 26 Feb 2019 16:17:04 +0100 Subject: [PATCH 5/5] fix prettier --- website/versioned_docs/version-24.0/GettingStarted.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/website/versioned_docs/version-24.0/GettingStarted.md b/website/versioned_docs/version-24.0/GettingStarted.md index f24a08288b8e..637d74655e12 100644 --- a/website/versioned_docs/version-24.0/GettingStarted.md +++ b/website/versioned_docs/version-24.0/GettingStarted.md @@ -152,8 +152,7 @@ Jest can be used in projects that use [webpack](https://webpack.github.io/) to m ### Using TypeScript -Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. -Next install the `@babel/preset-typescript` via `yarn`: +Jest supports TypeScript, via Babel. First make sure you followed the instructions on [using Babel](#using-babel) above. Next install the `@babel/preset-typescript` via `yarn`: ```bash yarn add --dev @babel/preset-typescript