title: Unexpected token import with Webpack and Babel
body: <p>I added react-router v4 to my project with Webpack and NodeJS. The app compiled correctly without any error messages in the log, but the browser console gave me this:</p>
  
  <pre><code>Uncaught SyntaxError: Unexpected token import
      at Object.&lt;anonymous&gt; (bundle.js:3391)
      at __webpack_require__ (bundle.js:556)
      at fn (bundle.js:87)
      at Object.eval (eval at &lt;anonymous&gt; (bundle.js:1405), &lt;anonymous&gt;:11:25)
      at Object.eval (eval at &lt;anonymous&gt; (bundle.js:1405), &lt;anonymous&gt;:24:27)
      at eval (eval at &lt;anonymous&gt; (bundle.js:1405), &lt;anonymous&gt;:25:30)
      at Object.&lt;anonymous&gt; (bundle.js:1405)
      at __webpack_require__ (bundle.js:556)
      at fn (bundle.js:87)
      at Object.eval (eval at &lt;anonymous&gt; (bundle.js:3379), &lt;anonymous&gt;:12:17)
  </code></pre>
  
  <p>I think that the problem is in the Webpack configuration. This is my <code>webpack.config.js</code>:</p>
  
  <pre><code>var path = require('path')
  var webpack = require('webpack')
  var NpmInstallPlugin = require('npm-install-webpack-plugin')
  var autoprefixer = require('autoprefixer');
  var precss = require('precss');
  
  module.exports = {
    devtool: 'cheap-module-eval-source-map',
    entry: [
      'webpack-hot-middleware/client',
      'babel-polyfill',
      './src/index'
    ],
    output: {
      path: path.join(__dirname, 'dist'),
      filename: 'bundle.js',
      publicPath: '/static/'
    },
    plugins: [
      new webpack.optimize.OccurenceOrderPlugin(),
      new webpack.HotModuleReplacementPlugin(),
      new NpmInstallPlugin()
    ],
    module: {
      preLoaders: [
        {
          test: /\.js$/,
          loaders: ['eslint'],
          include: [
            path.resolve(__dirname, "src"),
          ],
        }
      ],
      loaders: [
        {
          loaders: ['react-hot', 'babel-loader'],
          include: [
            path.resolve(__dirname, "src"),
          ],
          test: /\.js$/,
          plugins: ['transform-runtime'],
          presets: ['es2015','react']
        },
        {
          test:   /\.css$/,
          loader: "style-loader!css-loader!postcss-loader"
        }
      ]
    },
    postcss: function () {
      return [autoprefixer, precss];
    }
  }
  </code></pre>
  
  <p>Here is my <code>package.json</code> file:</p>
  
  <pre><code>{
    "name": "redux-ru-tutorial",
    "version": "1.0.0",
    "description": "Redux RU tutorial",
    "main": "index.js",
    "scripts": {
      "start": "node server.js"
    },
    "author": "Yuriy Shipovalov",
    "license": "MIT",
    "devDependencies": {
      "autoprefixer": "^6.3.1",
      "babel-core": "^6.4.5",
      "babel-eslint": "^4.1.6",
      "babel-loader": "^6.2.1",
      "babel-plugin-transform-runtime": "^6.4.3",
      "babel-preset-es2015": "^6.24.1",
      "babel-preset-react": "^6.3.13",
      "babel-preset-stage-0": "^6.3.13",
      "css-loader": "^0.23.1",
      "eslint": "^1.10.3",
      "eslint-loader": "^1.2.1",
      "eslint-plugin-react": "^3.16.1",
      "express": "^4.13.4",
      "npm-install-webpack-plugin": "^2.0.2",
      "postcss-loader": "^0.8.0",
      "precss": "^1.4.0",
      "react-hot-loader": "^1.3.0",
      "style-loader": "^0.13.0",
      "webpack": "^1.12.12",
      "webpack-dev-middleware": "^1.5.1",
      "webpack-hot-middleware": "^2.6.4"
    },
    "dependencies": {
      "babel-polyfill": "^6.3.14",
      "babel-runtime": "^6.3.19",
      "cors": "^2.8.3",
      "history": "^4.6.1",
      "jquery": "^3.2.1",
      "react": "^0.14.6",
      "react-dom": "^0.14.6",
      "react-redux": "^4.0.6",
      "react-redux-router": "0.0.5",
      "react-router": "^4.1.1",
      "react-router-dom": "^4.1.1",
      "redux": "^3.3.1",
      "redux-logger": "2.5.2",
      "redux-thunk": "1.0.3"
    }
  }
  </code></pre>
  
  <p>Here is my <code>index.js</code> file:</p>
  
  <pre><code>import React from 'react'
  import { render } from 'react-dom'
  import { Provider } from 'react-redux'
  import {BrowserRouter as Router, Route} from 'react-router-dom'
  import App from './containers/App'
  import './styles/app.css'
  import configureStore from './store/configureStore'
  
  const store = configureStore()
  console.log(store.getState())
  render(
    &lt;Provider store={store}&gt;
        &lt;Router&gt;
            &lt;Route&gt; path="/" component={App}&gt;&lt;/Route&gt;
        &lt;/Router&gt;
    &lt;/Provider&gt;,
    document.getElementById('root')
  )
  </code></pre>