Understanding webpack with cssnext configuration

Well , I'm having this basic issue trying to make work cssnext-postcss with webpack (n glob).

I don't really know if this is the correct way to ask or solve something, but there is no comprehensive guide to achieve an optimal way . (everytime I ask in stackoverflow seems that I'm asking to this guy http://i.imgur.com/uqMlfgT.png ... and of course I'm Homer Simpson) ( but the one tutorial that put me in the correct lane was: https://www.phase2technology.com/blog/bundle-your-front-end-with-webpack/ )

This was my attempt:

'use strict';

var webpack = require('webpack'); var glob = require('glob');

let scripts = { entry: { 'scripts': glob.sync('./_javascript/*.js'), }, module: { loaders: [ // Javascript: js, jsx { test: /.jsx?$/, loader: 'babel-loader' } ] }, output: { path: './resources/js', filename: 'bundle--[name].js' }, plugins: [ new webpack.optimize.CommonsChunkPlugin(['scripts'], 'bundle--[name].js'), new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }) ] };

let styles = { entry: { 'styles': glob.sync('./_cssnext/*.css'), }, module: { loaders: [{ test: /.css$/, loader: "style-loader!css-loader!postcss-loader" }] }, postcss: function(){ return [ require("postcss-import")({ addDependencyTo: webpack }), require("postcss-url"), require("postcss-cssnext"), require('postcss-normalize'), require("postcss-browser-reporter"), require("postcss-reporter"), ] }, output: { path: './resources/css', filename: 'bundle--[name].css' },

plugins: [
    new webpack.optimize.CommonsChunkPlugin(['styles'], 'bundle--[name].css'),
]

};

module.exports = [ styles, scripts ];

In Theory everything should work , but it's not... I'm only asking if you guys can throw me in the right direction.

/r/webpack Thread