Universal webpack configuration files

aliases.js

var path = require('path');
var assign = require('object-assign');

// Functions for resolving all the aliases
// Currently only resolves folder names in the `client` directory
var path_base = path.resolve(__dirname, '../');
const resolve = path.resolve;
const base = function() {
  var args = [path_base];
  args.push.apply(args, arguments);
  return resolve.apply(resolve,args);
};
const resolveClient = base.bind(null, 'src/client');
const resolveShared = base.bind(null, 'src');

// Client folder aliases
const clientAliases = [
  'components',
  'constants',
  'containers',
  'styles',
  'utils'
];

// Aliases for the shared code folder
const sharedAliases = [
  'shared'
];

// Resolve all the aliases

const resolvedClientAliases = clientAliases.reduce(function(accumulator, directory){
  accumulator[directory] = resolveClient(directory);
  return accumulator;
}, {});

const resolvedSharedAliases = sharedAliases.reduce(function(accumulator, directory){
  accumulator[directory] = resolveShared(directory);
  return accumulator;
}, {});

module.exports = assign({}, resolvedClientAliases, resolvedSharedAliases);

package.json

"scripts": {
    "dev": "npm-run-all development-prepare-server-build development",
    "development": "npm-run-all --parallel development-build-client development-build-server",
    "development-prepare-server-build": "universal-webpack --settings ./webpack/universal-webpack-settings.js prepare",
    "development-build-client": "webpack --watch --progress --display-error-details --verbose --display-error-details --config webpack/webpack.config.client.development.entry.js --color",
    "development-build-server": "webpack --config ./webpack/webpack.config.server.development.entry.js --watch --color --display-error-details",
    "production": "npm-run-all production-build-client production-build-server production-server",
    "production-build-client": "webpack --colors --display-error-details --config ./webpack/webpack.config.client.production.entry.js",
    "production-build-server": "webpack --colors --display-error-details --config ./webpack/webpack.config.server.production.entry.js"
  }

universal-webpack-settings.js

module.exports =
{
    server:
    {
        input: './src/server/server.js',
        output: './build/server/server.js'
    }
}

webpack.config.client.development.entry.js

require('babel-register');

module.exports = require(require('path').resolve(__dirname, 'webpack.config.client.development'));

webpack.config.client.development.js

import base_configuration from './webpack.config.client';
import webpack from 'webpack';
import BrowserSyncPlugin from 'browser-sync-webpack-plugin';

const clientPort = process.env.PORT || 7000;
const serverPort = process.env.SERVER_PORT || 3000;

const configuration = base_configuration({ development: true, css_bundle: true });
configuration.devtool = 'inline-eval-cheap-source-map';
configuration.plugins.push(
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: JSON.stringify('development'),
      BABEL_ENV: JSON.stringify('development/client')
    },
    __PRODUCTION__: false,
    __DEVELOPMENT__: true,
    __CLIENT__: true,
    __SERVER__: false,
    __DEVTOOLS__: false
  }),
  new webpack.HotModuleReplacementPlugin(),
  new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', filename: 'vendor.js'}),
  new BrowserSyncPlugin({
    notify: false,
    minify: false,
    host: 'localhost',
    port: clientPort,
    proxy: {
      target: 'http://localhost' + serverPort
    },
    serveStatic: ['./dist'],
    files: [
      'src/client/**/*.scss',
      'src/client/**/*.js'
    ],
    ghostMode: false
  }, {
    reload: true
  })
);

configuration.output.pathInfo = true;

export default configuration;

webpack.config.client.js

import { client_configuration } from 'universal-webpack'
import settings from './universal-webpack-settings'
import configuration from './webpack.config'

export default function(options)
{
	return client_configuration(configuration, settings, options)
}

webpack.config.js

import path from 'path';
import aliases from './aliases';

const rootPath = path.resolve(__dirname, '..');

const regular_expressions =
{
	javascript : /\.js$/,
	styles     : /\.scss$/
};

const config = {
  context: rootPath,
  target: 'node',
  entry: {
    main: path.resolve(__dirname, '..', 'src', 'client', 'index.js'),
    vendors: [
      'react'
    ]
  },
  output: {
    path: path.resolve(__dirname, '..', 'dist'),
    publicPath: '/dist/',
    filename: '[name]-[hash].js',
    chunkFilename: '[name]-[chunkhash].js',
    pathInfo: false
  },
  module: {
    preLoaders: [
      {
        test: regular_expressions.javascript,
        loader: "eslint-loader",
        exclude: /node_modules/
      }
    ],
    loaders: [
      {
        test: regular_expressions.javascript,
        exlude: /node_modules/,
        loader: 'babel',
        query: {
          presets: ['react', 'es2015', 'stage-0']
        }
      },
      {
				test    : regular_expressions.styles,
				loaders :
				[
					'style-loader',
					'css-loader?importLoaders=2&sourceMap',
					'postcss-loader',
					'sass-loader?outputStyle=expanded&sourceMap=true&sourceMapContents=true'
				]
			},
      {
				test    : /\.(jpg|png)$/,
				loaders :
				[
					'url-loader?limit=10000' // Any png-image or woff-font below or equal to 10K will be converted to inline base64 instead
				]
			}
    ]
  },
  resolve: {
    root: '../',
    alias: aliases,
    modulesDirectories: [
      'node_modules',
      'src'
    ]
  },
  progress: true,
  plugins: []
};

config.regular_expressions = regular_expressions;

export default config;

webpack.config.server.development.entry.js

require('babel-register')

module.exports = require(require('path').resolve(__dirname, 'webpack.config.server.development'))

webpack.config.server.development.js

import base_configuration from './webpack.config.server';
export default base_configuration;

webpack.config.server.js

import { server_configuration } from 'universal-webpack'
import settings from './universal-webpack-settings'
import configuration from './webpack.config'

export default server_configuration(configuration, settings);

webpack.config.server.production.entry.js

require('babel-register')

module.exports = require(require('path').resolve(__dirname, 'webpack.config.server.production'))

webpack.config.server.production.js

import base_configuration from './webpack.config.server';
export default base_configuration;