diff --git a/README.md b/README.md
index fa54c60f2..60363d863 100644
--- a/README.md
+++ b/README.md
@@ -6,7 +6,7 @@
[![PRs Welcome][prs-badge]][prs] [![Chat][chat-badge]][chat]
[![Backers on Open Collective][oc-backer-badge]](#backers)
-[![Sponsors on Open Collective][oc-sponsor-badge]](#sponsors)
+[![Sponsors on Open Collective][oc-sponsor-badge]](#sponsors)
[![Watch on GitHub][github-watch-badge]][github-watch]
[![Star on GitHub][github-star-badge]][github-star]
@@ -98,9 +98,13 @@ Follow [these code examples](https://github.com/Grimones/cra-rhl/commit/4ed74af2
### TypeScript
-When using TypeScript, Babel is not required, but React Hot Loader will not work without it.
+When using TypeScript, Babel is not required, but React Hot Loader will not work (properly) without it.
Just add `babel-loader` into your Webpack configuration, with React Hot Loader plugin.
+There is 2 different ways to do it.
+
+##### Add babel AFTER typescript.
+
```js
{
test: /\.tsx?$/,
@@ -117,7 +121,7 @@ Just add `babel-loader` into your Webpack configuration, with React Hot Loader p
}
```
-You **also have to modify your `tsconfig.json`**:
+In this case you have to modify your `tsconfig.json`, and compile to ES6 mode, as long React-Hot-Loader babel plugin could not understand ES5 code.
```json
// tsconfig.json
@@ -127,7 +131,29 @@ You **also have to modify your `tsconfig.json`**:
}
```
-Yet again - module = es6 **will not work**.
+##### Add babel BEFORE typescript (preferred)
+
+```js
+{
+ test: /\.tsx?$/,
+ use: [
+ 'ts-loader', // (or awesome-typescript-loader)
+ {
+ loader: 'babel-loader',
+ options: {
+ plugins: [
+ '@babel/plugin-syntax-typescript',
+ '@babel/plugin-syntax-decorators',
+ '@babel/plugin-syntax-jsx',
+ 'react-hot-loader/babel',
+ ],
+ },
+ }
+ ],
+}
+```
+
+In this case you can compile to ES5. More about [typescript and react-hot-loader](https://github.com/gaearon/react-hot-loader/issues/884)
We also have a [full example running TypeScript + React Hot Loader](https://github.com/gaearon/react-hot-loader/tree/master/examples/typescript).
@@ -458,8 +484,6 @@ Support this project by becoming a sponsor. Your logo will show up here with a l
-
-
## License
MIT