Webpack 2 with Multipage Express web app – SEO

we are migrating our web app from ASP.NET and jQuery to Node.js with Express and React. We are using the typical multipage application (MVC), and we are confortable with this architecture and we need it for some special cases (basically SEO, and we know that with react now you can improve the SEO).

We want to maintain our routes without using React Router, we are going to use Express MVC Router but we want to use WebPack 2 with React.

The first step was migrating the BackEnd (we are almost done), and the second part is migrate the frontend from jQuery to React (yes, React like UI Library, we don’t want Redux and we can work fine with just Component State because our pages are not very complex, and we want to reuse components).

Like we are using MVC Express routes we need to use Code Spliting from WebPack 2 to generate multiple entries for each page (js files), and we want to integrate typical stuff for make more productive: live reload, production build js, etc.

We have one example working of WebPack for creating the Entry libraries, and vendors and common, but we don’t know how to integrate with our server.js (Express app), and have a good flow…

Example WebPack config:

var path = require('path')
var webpack = require('webpack')

var config = {
  entry: {
    vendors: ['react', 'lodash'],
    common: ['lodash'],
    home: path.resolve(__dirname, './src/main'),
    page1: path.resolve(__dirname, './src/page1'),
    page2: path.resolve(__dirname, './src/page2'),    
  },
  output: {
    path: path.join(__dirname, 'js'),
    filename: '[name].bundle.js',
    chunkFilename: '[id].chunk.js'
  },
  devtool: 'source-map',
  devServer: {
    inline: true,
    contentBase: './src',
    port: 3000
  },
  module: {
    loaders: [
      {
        test: /.js$/,
        exclude: /node_modules/,
        loader: 'babel'
      }
    ]
  },
  plugins: [
    new webpack.optimize.OccurenceOrderPlugin(true),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.UglifyJsPlugin({
      output: {
        comments: false
      },
      compress: {
        warnings: false,
        screw_ie8: true
      }
    }),
    new webpack.optimize.CommonsChunkPlugin({
            names: ["common", "vendors"],
            minChunks: Infinity
        })

  ]
}

if (process.env.NODE_ENV === 'production') {
  config.output.path = path.join(__dirname, 'dist/')

  /*
  Note: by default, React will be in development mode
        see https://facebook.github.io/react/downloads.html
  */
  config.plugins.push(new webpack.DefinePlugin({
    'process.env': {
      'NODE_ENV': '"production"'
    }
  }))
}

module.exports = config

My question is… Can we get this working with Express and live reload? Like we do with create-react-app? Any link or tutorial to explain how to work with Multipage applications and WebPack together?

Thanks!