"extract-text-webpack-plugin" loader is used without the corresponding plugin How to deal

[Chryseis]

it's my webpack.config.js

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

module.exports = {
    devtool: 'source-map',
    entry: [
        'webpack-dev-server/client?http://127.0.0.1:3000', // WebpackDevServer host and port
        'webpack/hot/only-dev-server',
        './app/main.js',
        './css/main.scss'
    ],
    output: {
        path: __dirname + '/assets/',
        publicPath: "/assets/",
        filename: 'bundle.js'
    },
    module: {
        preLoaders: [{
            test: /\.(js|jsx)$/,
            exclude: /node_module/,
            loader: 'eslint'
        }],
        loaders: [{
            test: /\.(js|jsx)$/,
            exclude: /node_module/,
            loader: 'babel'
        }, {
            test: /\.css$/,
            loader: "style!css"
        }, {
            test: /\.scss$/,
            loader: ExtractTextPlugin .extract("style", "css!sass?sourceMap")
        }]
    },
    resolve: {
        extension: ['', '.js', '.jsx'],
        alias: {
            'react': path.join(__dirname, 'node_modules', 'react/dist/react.min.js'),
            'react-dom': path.join(__dirname, 'node_modules', 'react-dom/dist/react-dom.min.js')
        }
    },
    plugins: [new webpack.HotModuleReplacementPlugin(), new webpack.ProvidePlugin({
        "React": "react",
        "ReactDOM": "react-dom",
        "_": "lodash",
        "classnames":"classnames"
    },new ExtractTextPlugin ("style.css",{allChunks: true}))
    ]
};

In extract-text-webpack-plugin/loader.js,I find

    if(this[__dirname] === undefined) {
        throw new Error(
            '"extract-text-webpack-plugin" loader is used without the corresponding plugin, ' +
            'refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example'
        );
    } 

so What should I do?

[Chryseis]

I made a mistake,

 plugins: [new webpack.HotModuleReplacementPlugin(), new webpack.ProvidePlugin({
        "React": "react",
        "ReactDOM": "react-dom",
        "_": "lodash",
        "classnames":"classnames"
    },new ExtractTextPlugin ("style.css",{allChunks: true}))

correct code

    plugins: [new webpack.HotModuleReplacementPlugin(), new webpack.ProvidePlugin({
        "React": "react",
        "ReactDOM": "react-dom",
        "_": "lodash",
        "classnames":"classnames"
    }),new ExtractTextPlugin("[name].css",{allChunks: true})
    ]

[AbhilashNagaraj]

ERROR in Error: Module build failed: Error: "extract-text-webpack-plugin" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example
at Object.pitch (D:\SarasManthan.Core\SarasManthan\SarasManthan.Core.App\node_modules\extract-text-webpack-plugin\dist\loader.js:53:11)
at Object. (D:/SarasManthan.Core/SarasManthan/SarasManthan.Core.App/node_modules/@swimlane/ngx-datatable/release/components/datatable.component.css:70:7)
at webpack_require (D:/SarasManthan.Core/SarasManthan/SarasManthan.Core.App/node_modules/@swimlane/ngx-datatable/release/components/datatable.component.css:20:30)
at D:/SarasManthan.Core/SarasManthan/SarasManthan.Core.App/node_modules/@swimlane/ngx-datatable/release/components/datatable.component.css:63:18
at D:/SarasManthan.Core/SarasManthan/SarasManthan.Core.App/node_modules/@swimlane/ngx-datatable/release/components/datatable.component.css:66:10
at ContextifyScript.Script.runInContext (vm.js:32:29)
at ContextifyScript.Script.runInNewContext (vm.js:38:15)
at Object.runInNewContext (vm.js:91:38)
at WebpackResourceLoader._evaluate (D:\SarasManthan.Core\SarasManthan\SarasManthan.Core.App\node_modules@ngtools\webpack\src\resource_loader.js:110:40)
at Compilation.compilation.plugin (D:\SarasManthan.Core\SarasManthan\SarasManthan.Core.App\node_modules@ngtools\webpack\src\resource_loader.js:58:26)
at Compilation.applyPluginsAsyncSeries (D:\SarasManthan.Core\SarasManthan\SarasManthan.Core.App\node_modules\tapable\lib\Tapable.js:206:13)
Child html-webpack-plugin for "Index.cshtml":
1 asset
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./Views/Home/Index.cshtml 5.93 kB {0} [built]
factory:1616ms building:29ms = 1645ms
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[] -> factory:17ms building:3ms = 20ms
[3] (webpack)/buildin/module.js 517 bytes {0} [built]
[] -> factory:17ms building:3ms = 20ms
+ 1 hidden module
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!node_modules/nouislider/distribute/nouislider.css:
2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!node_modules/bootstrap/dist/css/bootstrap.css:
5 assets
8 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!node_modules/font-awesome/css/font-awesome.css:
5 assets
9 modules
npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "build:prod" "--color=always"
npm ERR! node v7.9.0
npm ERR! npm v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! saras_manthan@1.0.0 build:prod: webpack --env=prod --progress --profile --colors
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the saras_manthan@1.0.0 build:prod script 'webpack --env=prod --progress --profile --colors'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the saras_manthan package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! webpack --env=prod --progress --profile --colors
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs saras_manthan
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls saras_manthan
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:

Can please resolve anyone?

[alexander-akait]

@AbhilashNagaraj please double check you configuration. thanks!

[AbhilashNagaraj]

Hi evilebottnawi,
Thank you for your reply,
I was check configuration again, It working fine for web-pack-dev build but problem was in web-pack-prod build!

Thanks in advance