Docs request: Using CSS Modules with extract-text-webpack-plugin

[kevinSuttle]

loader: ExtractTextPlugin.extract("style-loader", "css-loader")
vs
loader: 'style!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]'

[joshblack]

It would be the same pattern, except you would also pass the parameters into the css-loader part.

For example:

loader: ExtractTextPlugin.extract(
  'style',
  'css?modules&importLoaders=1&localIdentName=[hash:base64:5]&minimize',
)

[kurt-hardy]

I know this was awhile ago but I'm having problems with getting CSS module working with the ExtractTextPlugin. I have tried lots of things to no avail. Does anyone have a working example?

I have tried the following loaders
ExtractTextPlugin.extract("style", "css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]" ), "sass"

And
ExtractTextPlugin.extract("style"), "css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]", "sass"

Any help would be great :-)

Thanks
Kurtis

[janusch]

@kurt-hardy the first syntax look right, not the second one.
What is it that is not working?

here one from here: https://github.com/react-toolbox/react-toolbox-example/blob/master/webpack.config.js

ExtractTextPlugin.extract('style', 'css?sourceMap&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass')

[kurt-hardy]

@janusch thanks for your response.

I had ExtractTextPlugin(...), "sass". SASS being outside of the parenthesis for the plugin. Once I removed that it worked. I didn't realise that the second parameter was the loaders I wanted to run.

Thanks.
Kurtis

[janusch]

Sassy sass loader! Glad you figured it out.
This loader chains can be so confusing. I am trying to get a config for webpack 2 working, no luck :(
PostCSS + cssnext wont transpile css variables, and I don't understand why.