Webpack2 LESSファイルのロードと抽出

Question

Webpack2を設定して、私のLESSファイルを処理し、そこから別のCSSを作成しようとしています。私はしかし、エラーが発生し続けます。私は、Webpack2の例を見つけ出すのに手間がかかっていて、プロセスの概要を説明しています。

マイWebPACKの設定：

module.exports = { 
    entry: { 
    'public': [ 
     './src/client/styles/public.js' 
    ] 
    }, 
    output: { 
    ... 
    }, 
    module: { 
     { 
     test: /.*\.less$/, 
     loader: ExtractTextPlugin.extract({ loader: 'less-loader', fallbackLoader: 'style-loader' }) 
     } 
    ] 

    }, 
    plugins: [ 
    new ExtractTextPlugin({ filename: '[name].css', disable: false, allChunks: true }) 
    ] 
} 

public.jsファイル（私も同じ結果にエントリに直接以下のファイルを渡してみました）：

require('style.less') 

style.lessファイル

a { color: red; } 

エラー：

ERROR in ./~/less-loader!./src/client/styles/style.less 
Module parse failed: /node_modules/less-loader/index.js!/src/client/styles/style.less Unexpected token (1:2) 
You may need an appropriate loader to handle this file type. 
| a { 
| color: red; 
| } 

ローダーが少なくても、ファイルが正しく渡されているが破損していることがメッセージからわかります。私は空のファイルを試してみたが、その後、私は得る：

TypeError: text.forEach is not a function 

バージョン：

"extract-text-webpack-plugin": "^2.0.0-beta.4", 
"less": "^2.7.1", 
"less-loader": "^2.2.3", 
"style-loader": "^0.13.1", 
"webpack": "^2.1.0-beta.25", 
"webpack-dev-server": "^2.1.0-beta.5", 
"yargs": "~3.5.4" 

問題である可能性があり何？

Answer 1

[OK]を...それは、作業ました：

loader: ExtractTextPlugin.extract({ 
    loader:[ 'css', 'less' ], 
    fallbackLoader: 'style-loader' 
}) 

Answer 2

また、スタイルローダーやCSSローダーのような追加の負荷を使用する必要があります。 Docsから：

var css = require("!raw!less!./file.less"); 
// => returns compiled css code from file.less, resolves imports 
var css = require("!css!less!./file.less"); 
// => returns compiled css code from file.less, resolves imports and url(...)s 

あまりローダーはちょうどCSSに処理を行います。 WebpackはCSSを取り除く前にCSSをどのように組み込むべきかを知る必要があります。