add test components

.gitignore

@@ -1 +1,2 @@
 node_modules/
+dist/

index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="UTF-8" />
+  <title>demo</title>
+</head>
+
+<body>
+  <div id="root"></div>
+  <script src="./dist/bundle.js"></script>
+</body>
+
+</html>

src/components/Hello.tsx

@@ -0,0 +1,28 @@
+import * as React from 'react';
+
+export interface Props {
+  name: string;
+  enthusiasmLevel?: number;
+}
+
+export default class Hello extends React.Component<Props, object> {
+  render() {
+    const { name, enthusiasmLevel = 1 } = this.props;
+
+    if (enthusiasmLevel <= 0) {
+      throw new Error('You could be a little more enthusiastic. :D');
+    }
+
+    return (
+      <div className="hello">
+        <div className="greeting">
+          Hello {name + getExclamationMarks(enthusiasmLevel)}
+        </div>
+      </div>
+    );
+  }
+}
+
+function getExclamationMarks(numChars: number) {
+  return Array(numChars + 1).join('!');
+}

src/index.tsx

@@ -0,0 +1,9 @@
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+
+import Hello from "./components/Hello";
+
+ReactDOM.render(
+  <Hello name="TypeScript" enthusiasmLevel={10} />,
+  document.getElementById('root') as HTMLElement
+);

webpack.common.config.js

@@ -0,0 +1,24 @@
+module.exports = {
+  entry: "./src/index.tsx",
+  output: {
+    filename: "bundle.js",
+    path: __dirname + "/dist"
+  },
+
+  devtool: "source-map",
+
+  resolve: {
+    extensions: [".ts", ".tsx", ".js", ".json"]
+  },
+
+  module: {
+    rules: [
+      { test: /\.tsx?$/, loader: "ts-loader" },
+
+      { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
+    ]
+  },
+
+  plugins: [
+  ],
+};