Migrate ts-loader to awesome-typescript-loader

package.json

@@ -17,6 +17,7 @@
     "@types/node": "^7.0.21",
     "@types/react": "^15.0.24",
     "@types/react-dom": "^15.5.0",
+    "babel-core": "^6.24.1",
     "eslint": "3.19.0",
     "husky": "^0.13.2",
     "lerna": "2.0.0-beta.38",

packages/react-scripts/config/paths.js

@@ -105,6 +105,7 @@ if (
     appHtml: resolveOwn('template/public/index.html'),
     appIndexJs: resolveOwn('template/src/index.tsx'),
     appPackageJson: resolveOwn('package.json'),
+    appTemplate: resolveOwn('template'),
     appSrc: resolveOwn('template/src'),
     yarnLockFile: resolveOwn('template/yarn.lock'),
     testsSetup: resolveOwn('template/src/setupTests.ts'),

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

@@ -185,7 +185,11 @@ module.exports = {
       {
         test: /\.(ts|tsx)$/,
         include: paths.appSrc,
-        loader: require.resolve('ts-loader'),
+        loader: require.resolve('awesome-typescript-loader'),
+        query: {
+          useBabel: true,
+          configFileName: path.join(paths.appTemplate, 'tsconfig.json'),
+        },
       },
       // "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,11 @@ module.exports = {
       {
         test: /\.(ts|tsx)$/,
         include: paths.appSrc,
-        loader: require.resolve('ts-loader'),
+        loader: require.resolve('awesome-typescript-loader'),
+        query: {
+          useBabel: true,
+          configFileName: path.join(paths.appTemplate, 'tsconfig.json'),
+        },
       },
       // The notation here is somewhat confusing.
       // "postcss" loader applies autoprefixer to our CSS.

packages/react-scripts/package.json

@@ -22,8 +22,9 @@
     "react-scripts-ts": "./bin/react-scripts-ts.js"
   },
   "dependencies": {
-    "autoprefixer": "7.1.0",
     "app-root-path": "^2.0.1",
+    "autoprefixer": "7.1.0",
+    "awesome-typescript-loader": "^3.1.3",
     "case-sensitive-paths-webpack-plugin": "2.0.0",
     "chalk": "1.1.3",
     "cli-highlight": "1.1.4",
@@ -38,16 +39,15 @@
     "postcss-flexbugs-fixes": "3.0.0",
     "postcss-loader": "2.0.5",
     "promise": "7.1.1",
+    "source-map-loader": "^0.2.1",
     "react-dev-utils": "^2.0.1",
     "react-error-overlay": "^1.0.6",
     "style-loader": "0.17.0",
-    "ts-loader": "^2.0.3",
+    "sw-precache-webpack-plugin": "0.9.1",
     "tslint": "^5.2.0",
     "tslint-loader": "^3.5.3",
     "tslint-react": "^3.0.0",
     "typescript": "^2.3.3",
-    "source-map-loader": "^0.2.1",
-    "sw-precache-webpack-plugin": "0.9.1",
     "url-loader": "0.5.8",
     "webpack": "2.6.0",
     "webpack-dev-server": "2.4.5",