webpack.config.js

webpack.config.js

var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

var postcss_plugins = [
  require('autoprefixer-core')({
    browsers: ['IE >= 9', 'last 2 version'],
    cascade: false
  }),
  require('postcss-import'),
  require('postcss-mixins'),
  require('postcss-simple-vars'),
  require('postcss-custom-properties'),
  require('postcss-nested')
];


var settings = {
  entry: './_js/app.js',
  destfolder: './public',
  subfolder: {
    js: '/js',
    css: '/css'
  },
  destfile: {
    js: '/app.js',
    css: '/screen.css'
  }
}

function buildPath(type){
  return settings.subfolder[type] + settings.destfile[type];
}

module.exports = {
  entry: {
    app: settings.entry
    //vendor: ['polyfill']
  },
  devtool: 'eval',
  output: {
    path: settings.destfolder,
    filename: buildPath('js')
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel'
      },
      {
        test: /\.css$/,
        loader: ExtractTextPlugin.extract('css!postcss')
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'eslint'
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin(buildPath('css')),
    //new webpack.optimize.CommonsChunkPlugin('vendor', '/js/vendor.js')
  ],
  postcss: function(){
    return postcss_plugins;
  },
  resolve: {
    extensions: ['', '.json', '.js', '.css']
  },
  externals: {
    'react': 'React'
  }
};