title: Typescript - ReferenceError: exports is not defined
body: <p>In my console I keep getting <code>ReferenceError: exports is not defined</code> as an error.</p>
  
  <p>Code:</p>
  
  <p>app.ts:</p>
  
  <pre><code>import {IDetails} from "./interfaces/IDetails";
  
  class MyClass implements IDetails{
      constructor(){}
  
      public render (elem: string, text: string) {
          let el: HTMLElement = document.querySelector(elem);
          el.textContent = text;
          el.innerText = text;
      }
  }
  
  window.onload = () =&gt; {
      let myClass = new MyClass();
      myClass.render('body', 'Hello World!');
  };
  </code></pre>
  
  <p>IDetails.ts:</p>
  
  <pre><code>export interface IDetails {
      elem: string,
      text: string
  }
  </code></pre>
  
  <p>tsconfig.json:</p>
  
  <pre><code>{
    "compilerOptions": {
      "outDir": "./build/",
      "sourceMap": true,
      "noImplicitAny": false,
      "module": "commonjs",
      "target": "es5",
      "removeComments": true,
      "allowJs": true
    }
  }
  </code></pre>
  
  <p>webpack.config.js:</p>
  
  <pre><code>module.exports = {
      entry: './index.ts',
      output: {
          filename: 'bundle.js',
          path: __dirname
      },
      watch: true,
      module: {
          rules: [
              {
                  test: /\.tsx?$/,
                  loader: "ts-loader",
                  options: {
                      transpileOnly: true
                  }
              }
          ]
      },
      resolve: {
          extensions: [".tsx", ".ts", ".js"]
      },
  };
  </code></pre>
  
  <p>What am I doing wrong here? </p>
  
  <p><strong>EDIT</strong>: I have edited my question with <code>webpack.config.js</code> and <code>tsconfig.json</code>. It might also be worthy to notice that I'm viewing the files directly from Webstorm in my Chrome browser. Could that be an issue?</p>
  
  <p>Thank you.</p>