Use webpack instead of Browserify

Author: bvanreeven

.gitignore

@@ -1,3 +1,3 @@
 node_modules/
-public/js/app/*.js
+public/js/app/
 temp/

package.json

@@ -11,12 +11,14 @@
   "devDependencies": {
     "@types/react": "^0.14.39",
     "@types/react-dom": "^0.14.17",
-    "browserify": "^13.0.0",
     "mkdirp": "^0.5.1",
-    "typescript": "^2.0.3"
+    "source-map-loader": "^0.1.5",
+    "ts-loader": "^0.9.0",
+    "typescript": "^2.0.3",
+    "webpack": "^1.13.2"
   },
   "scripts": {
-    "build": "mkdirp public/js/app && tsc && browserify ./temp/app.js -o public/js/app/bundle.js",
+    "build": "webpack",
     "start": "http-server"
   },
   "author": "Benny van Reeven",

webpack.config.js

@@ -0,0 +1,26 @@
+module.exports = {
+    entry: "./app/app.tsx",
+    output: {
+        filename: "./public/js/app/bundle.js",
+    },
+
+    // Enable sourcemaps for debugging webpack's output.
+    devtool: "source-map",
+
+    resolve: {
+        // Add '.ts' and '.tsx' as resolvable extensions.
+        extensions: ["", ".webpack.js", ".web.js", ".ts", ".tsx", ".js"]
+    },
+
+    module: {
+        loaders: [
+            // All files with a '.ts' or '.tsx' extension will be handled by 'ts-loader'.
+            { test: /\.tsx?$/, loader: "ts-loader" }
+        ],
+
+        preLoaders: [
+            // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
+            { test: /\.js$/, loader: "source-map-loader" }
+        ]
+    },
+};