Module build failed: Error: Please check the validity of the CSS block starting from the line #3288

[mg]

I realise this error message has been reported before, but I'm not double chaining the css loader.

The css is the output from less-loader, specifically the less from www.material-ui.com.

webpack.config.js:

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

module.exports = {
    entry: './src/index.jsx',
    devtool: 'source-map',
    output: {
        path: path.join(__dirname, 'www'),
        filename: 'app.js'
    },
    resolve: {
        modulesDirectories: ['node_modules'],
    },
    module: {
        loaders: [
            { test: /\.css$/, loader: 'style!css' },
            { test: /\.less$/, loader: 'style!css!less' },
            { test: /\.jsx$/, loader: 'jsx-loader?harmony&insertPragma=React.DOM' },
            { test: /\.js$/, loader: '6to5-loader'},
            { test: /\.(eot|woff)$/, loader: 'file' },
        ]
    }
};

entry point (index.jsx):

require('./material-ui.less');
var React= require('react'),
    HelloMessage= require('./firstview.jsx')
React.render(<HelloMessage name="Hello" />, document.getElementById('app'));

material-ui.less:

@import "~material-ui/src/less/scaffolding.less";
@import "~material-ui/src/less/components.less";

Output:

ERROR in ./~/css-loader!./~/less-loader!./src/material-ui.less
Module build failed: Error: Please check the validity of the CSS block starting from the line #3288
    at throwError (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:399:15)
    at getBlock (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:755:18)
    at getAtruleb (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:632:34)
    at getAtrule (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:606:28)
    at getStylesheet (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:1937:60)
    at Object.CSSPRules.stylesheet (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:365:69)
    at _getAST (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:409:38)
    at exports.srcToCSSP (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:2287:16)
    at Object.exports.srcToCSSP (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/gonzales.cssp.node.js:2292:16)
    at Object.exports.parse (/Users/mg/Documents/js/scaffold-web-rx/node_modules/css-loader/node_modules/csso/lib/cssoapi.js:7:21)
 @ ./src/material-ui.less 4:14-231

Any ideas? Is there any way for me to see what's going on at line #3288? Please consider that this is my first attempt at using webpack so assume that Im capable of any newbie error possible.

[sokra]

The used less lib "lesshat" generates invalid css in @keyframes:

madebysource/lesshat#129

[mg]

Further discussed in webpack-contrib/less-loader#23