Redux React Hello World

This is my Hello World Application in React-Redux. There shows no error when I run npm start in my command prompt, but when I open it on localhost:3333, its a blank page. I installed react react-dom babel babel-core babel-preset-es2015 babel-preset-react babel-loader webpack webpcak-dev-server. My cmd shows that its running on localhost:3333, and bundle is now Valid. Please help out coz this is my last try to react-redux, please do help.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Setup</title>
</head>
<body>
  <div id="app"></div>
  <script type="index.js"></script>
</body>
</html>

App.js

import React from 'react';
class App extends React.Component {
    render() {
        return <div>Hello</div>
    }
}

export default App

main.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('app'))

package.json

{
  "name": "redux1",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel": "^6.5.2",
    "react": "^0.14.7",
    "react-dom": "^0.14.7",
    "webpack": "^1.12.14",
    "webpack-dev-server": "^1.14.1"
  }
}

webpack.config.js

module.exports = {
    entry: './main.js',
    output: {
        path: './',
        filename: 'index.js'
    },
    devServer: {
        inline: true,
        port: 3333
    },
    module: {
        loaders: [
          {
            test:/\.js$/,
            exclude: /node_modules/,
            loader: 'babel',
            query: {
                presets: ['es2015','react']
            }
          }
        ]
    }
}

The title Setup displays on the browser tab i.e the title of html code is successfully shown on browser

Solution

Your webpack.config.js output filename should be bundle.js, which should be same with your index.html

And index.html should correct to <script src="bundle.js"></script>