Migrate ts-loader to awesome-typescript-loader

packages/react-scripts/config/webpack.config.dev.js

@@ -185,7 +185,10 @@ module.exports = {
       {
         test: /\.(ts|tsx)$/,
         include: paths.appSrc,
-        loader: require.resolve('ts-loader'),
+        loader: require.resolve('awesome-typescript-loader'),
+        query: {
+          useBabel: true,
+        },
       },
       // "postcss" loader applies autoprefixer to our CSS.
       // "css" loader resolves paths in CSS and adds assets as dependencies.

packages/react-scripts/config/webpack.config.prod.js

@@ -175,7 +175,10 @@ module.exports = {
       {
         test: /\.(ts|tsx)$/,
         include: paths.appSrc,
-        loader: require.resolve('ts-loader'),
+        loader: require.resolve('awesome-typescript-loader'),
+        query: {
+          useBabel: true,
+        },
       },
       // The notation here is somewhat confusing.
       // "postcss" loader applies autoprefixer to our CSS.

packages/react-scripts/package.json

@@ -43,7 +43,7 @@
     "react-dev-utils": "^1.0.2",
     "react-error-overlay": "^1.0.2",
     "style-loader": "0.17.0",
-    "ts-loader": "^2.0.3",
+    "awesome-typescript-loader": "^3.1.3",
     "tslint": "^5.2.0",
     "tslint-loader": "^3.5.3",
     "tslint-react": "^3.0.0",