Babel试图用webpack加载LESS风格

Question

我不确定为什么我会收到此SyntaxError。看起来好像我的加载器无法加载LESS但我的extract-text-webpack-plugin或ExtractTextPlugin能够构建它并且我最终在style.css处出现错误{1}}输出。似乎webpack正在尝试处理我的babel，但我不确定它是在尝试这样做。

错误：

LESS

webpack.watch.js：

 /Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/lib/transformation/file/index.js:671
[1]       throw err;
[1]       ^
[1] 
[1] SyntaxError: /Users/bli1/Development/Javascript/ReviewWeb/app/styles/index.less: Unexpected token (1:0)
[1] > 1 | @import "buttons.less";
[1]     | ^
[1]   2 | @import "register.less";
[1]   3 | @import "generic";
[1]   4 | 
[1]     at Parser.pp.raise (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
[1]     at Parser.pp.unexpected (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
[1]     at Parser.pp.parseDecorator (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:170:10)
[1]     at Parser.pp.parseDecorators (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:156:37)
[1]     at Parser.pp.parseStatement (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:58:10)
[1]     at Parser.parseStatement (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:621:22)
[1]     at Parser.pp.parseTopLevel (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:30:21)
[1]     at Parser.parse (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/parser/index.js:70:17)
[1]     at Object.parse (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/node_modules/babylon/lib/index.js:45:50)
[1]     at Object.exports.default (/Users/bli1/Development/Javascript/ReviewWeb/node_modules/babel-core/lib/helpers/parse.js:36:18)
[1] 24 Oct 16:12:41 - [nodemon] app crashed - waiting for file changes before starting...

webpack.config.js

var path = require("path"); 
var Webpack = require("webpack");
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var config = require("./webpack.config.js");

var port = process.env.WEBPACK_PORT || 8080;
var host = process.env.HOST || 'localhost';

// add hot loader
config.entry.unshift(
    "webpack-dev-server/client?http://" + host + ":" + port,
    "webpack/hot/only-dev-server"   // only prevents reload on syntax errors
);

config.plugins = [
    new Webpack.HotModuleReplacementPlugin(),
    new Webpack.NoErrorsPlugin(), // don't reload if there is an error
    new ExtractTextPlugin("style.css", {
        allChunks: true
    })
];

config.module.loaders = [
    { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
    { test: /\.less$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader!less-loader') },
    { test: /\.json$/, loader: 'json-loader' },
    { test: /\.jsx$/, loaders: ['react-hot','jsx-loader'], include: path.join(__dirname, 'app') },
    { test: /\.es6$/, exclude: /node_modules/, loader: 'babel-loader?stage=0&optional=runtime'},
    { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?stage=0&optional=runtime'}
];

// dev server for react hot loader
config.devServer = {
    publicPath:  "/js/",
    filename: 'main.js',
    contentBase: "./public",
    hot:         true,
    inline:      true,
    lazy:        false,
    quiet:       true,
    noInfo:      true,
    headers:     {"Access-Control-Allow-Origin": "*"},
    stats:       {colors: true},
    host:        "0.0.0.0",
    port:        port
};

module.exports = config;

这是我的npm脚本。我在运行var path = require('path') var webpack = require('webpack'); var ExtractTextPlugin = require("extract-text-webpack-plugin"); module.exports = { entry: [ './app/index.js' ], output: { path: './public/js', filename: 'main.js', }, devtool: 'eval', debug: true, module: { loaders: [ { test: /\.jsx$/, loaders: ['react-hot','jsx-loader'], include: path.join(__dirname, 'app') }, { test: /\.json$/, loader: 'json-loader' }, { test: /\.es6$/, exclude: /node_modules/, loader: 'babel-loader?stage=0&optional=runtime'}, { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?stage=0&optional=runtime'}, { test: /\.less$/, exclude: /node_modules/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader!less-loader')}, { test: /\.css$/, exclude: /node_modules/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') } ] }, plugins: [ new ExtractTextPlugin('style.css', { allChunks: true }), new webpack.optimize.CommonsChunkPlugin('common.js'), ] }; 时遇到错误：

npm run watch