Setup TypeScript

package.json

@@ -83,14 +83,17 @@
     ]
   },
   "babel": {
-    "presets": ["@babel/react"],
+    "presets": ["@babel/react", "@babel/typescript"],
     "plugins": [
       [
         "styled-jsx/babel",
         {
           "vendorPrefixes": false
         }
-      ]
+      ],
+      "@babel/plugin-proposal-numeric-separator",
+      "@babel/proposal-class-properties",
+      "@babel/proposal-object-rest-spread"
     ],
     "env": {
       "production": {
@@ -215,7 +218,15 @@
   "devDependencies": {
     "@babel/cli": "7.5.5",
     "@babel/core": "7.5.5",
+    "@babel/plugin-proposal-class-properties": "^7.4.0",
+    "@babel/plugin-proposal-numeric-separator": "^7.2.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.4.0",
     "@babel/preset-react": "7.0.0",
+    "@babel/preset-typescript": "7.3.3",
+    "@types/node": "12.7.4",
+    "@types/react": "16.9.2",
+    "@types/react-dom": "16.9.0",
+    "@types/react-redux": "7.1.2",
     "ava": "0.25.0",
     "babel-loader": "8.0.6",
     "babel-preset-minify": "0.5.1",
@@ -230,6 +241,7 @@
     "eslint-config-prettier": "2.6.0",
     "eslint-plugin-prettier": "2.3.1",
     "eslint-plugin-react": "7.3.0",
+    "fork-ts-checker-webpack-plugin": "1.5.0",
     "husky": "0.14.3",
     "inquirer": "5.1.0",
     "node-gyp": "3.6.2",
@@ -237,6 +249,7 @@
     "proxyquire": "1.8.0",
     "spectron": "3.8.0",
     "style-loader": "0.19.1",
+    "typescript": "3.6.2",
     "webpack": "4.39.3"
   },
   "resolutions": {

tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "checkJs": false,
+    "downlevelIteration": true,
+    "esModuleInterop": true,
+    "jsx": "react",
+    "lib": ["dom", "es2017"],
+    "module": "esnext",
+    "moduleResolution": "node",
+    "noEmit": true,
+    "preserveConstEnums": true,
+    "removeComments": false,
+    "resolveJsonModule": true,
+    "sourceMap": true,
+    "strict": true,
+    "target": "es6"
+  },
+  "include": [
+    "./lib/"
+  ],
+  "exclude": ["node_modules", "**/node_modules/*", "bin/*", "renderer/*"]
+}

webpack.config.js

@@ -2,6 +2,7 @@ const path = require('path');
 
 const webpack = require('webpack');
 const Copy = require('copy-webpack-plugin');
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 
 const nodeEnv = process.env.NODE_ENV || 'development';
 const isProd = nodeEnv === 'production';
@@ -11,7 +12,7 @@ module.exports = [
     mode: 'none',
     name: 'hyper',
     resolve: {
-      extensions: ['.js', '.jsx']
+      extensions: ['.js', '.jsx', '.ts', '.tsx']
     },
     devtool: isProd ? 'hidden-source-map' : 'cheap-module-source-map',
     entry: './lib/index.js',
@@ -22,7 +23,7 @@ module.exports = [
     module: {
       rules: [
         {
-          test: /\.(js|jsx)$/,
+          test: /\.(js|jsx|ts|tsx)$/,
           exclude: /node_modules/,
           loader: 'babel-loader'
         },
@@ -50,7 +51,8 @@ module.exports = [
           from: './assets',
           to: './assets'
         }
-      ])
+      ]),
+      new ForkTsCheckerWebpackPlugin()
     ],
     target: 'electron-renderer'
   },