title: React is undefined (Cannot read property 'createElement' of undefined)
body: <p>I'm trying to convert a working ReactJS application into TypeScript, and I've had some issues getting anything to work properly.</p>
  
  <pre><code>import React from "react";
  import * as ReactDOM from "react-dom";
  import Application from "./Application";
  
  console.log(React); // undefined
  
  ReactDOM.render(
      &lt;Application/&gt;, window.document.getElementById("application-wrapper")
  );
  </code></pre>
  
  <p>The console throws an error at <code>&lt;Application /&gt;</code></p>
  
  <p>When I import react like this, react loads:</p>
  
  <pre><code>import * as React from "react";
  </code></pre>
  
  <p>However, I want to use the import statement using the default export, because I import React using this import syntax in all the existing components:</p>
  
  <pre><code>import React, {Component} from "react";
  
  export default class Whatever extends Component&lt;Props, State&gt; {
  ...
  }
  </code></pre>
  
  <p>My <code>tsconfig.json</code> file contains this line allowing synthetic defaults:</p>
  
  <pre><code>"allowSyntheticDefaultImports": true
  </code></pre>
  
  <p>My <code>webpack.config.js</code> file:</p>
  
  <pre><code>let path = require("path");
  let config = {
      entry: "./src/main.tsx",
      output: {
          path: path.resolve(__dirname, "build"),
          filename: "bundle.js"
      },
      devtool: "source-map",
      resolve: {
          extensions: [".ts", ".tsx", ".js", ".jsx"]
      },
      module: {
          loaders: [
              {
              test: /\.tsx?$/,
              loader: "ts-loader",
              exclude: /node_modules/
              }
          ]       
      }
  };
  
  module.exports = config;
  </code></pre>
  
  <p>Not sure what I'm missing here....</p>