title: Webpack + react throw error with socket io
body: <p>I have a webpack server running with react, everything was working fine until I wanted to add socket.io, after that I was getting plenty of errors, still can't figure it our how to fix it..this is my code. Before webpack I was using express js and everything was looking good, any tips would be very apreciated;)</p>
  
  <p>////main.js </p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import App from './components/App';
  import express from 'express';
  const app = express();
  const server = app.listen(8081);
  const io = require('socket.io').listen(server);
  
  io.on('connection', socket =&gt; {
      socket.on('room', data =&gt; {
          socket.join(data);
          io.to(room).emit('msg', 'in the room!')
      })
  })
  
  ReactDOM.render(&lt;App/&gt;, document.getElementById('app'))
  </code></pre>
  
  <p>/// App.js</p>
  
  <pre><code>import React from 'react';
  let socket;
  class App extends React.Component {
      constructor() {
          super();
          this.clicked = this.clicked.bind(this);
      }
  
      componentDidMount() {
          socket = io();
      }
      clicked() {
          socket.emit('room', 'abc')
          socket.on('message', data =&gt; alert(data))
      }
      render() {
          return (&lt;div&gt;
                  &lt;button&gt;Join &lt;/button&gt;
              &lt;/div&gt;);
      }
  }
  
  export default App;
  </code></pre>
  
  <p>///index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;React&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="app"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;script src='bundle.js'&gt;&lt;/script&gt;
  &lt;script src="https://cdn.socket.io/socket.io-1.4.8.js"&gt;&lt;/script&gt;
  &lt;/html&gt; 
  </code></pre>