CSS Modules Naming

[joezimjs]

CSS Loader creates its class names simply with some sort of hash.

The CSS Modules spec actually uses .folder_file_className_h45H or something similar when attempting to make unique class names. This is preferable since it is now easier to determine what the class is and where it comes from instead of guessing or following an odd rabbit trail to figure it out.

Are there plans to start using the CSS Modules spec for this, or at least give us the option to use it? Can there be?

[joezimjs]

Nevermind... somehow missed localIdentname all this time. Is there a way to make the [path] portion relative to a certain url so I don't have super long paths in the class name?

[joezimjs]

ping...
I'm hoping to be able to adjust what [path] outputs. Right now it's 4 folders deep when I only want one: src-client-styles-components instead of being based in the styles path and outputting just components.

[sokra]

you can pass context as query param. pass an absolute path to the root for the naming.

[joezimjs]

Doesn't seem to be working, and I don't see any mention of context in the documentation...

[sokra]

yep, you're right. Sorry. It's missing here: https://github.com/webpack/css-loader/blob/master/lib/processCss.js#L152

[joezimjs]

So is it not implemented? I'm not familiar with what that code is doing so I'm not sure what you're showing me. If it isn't implemented, can you implement it? Otherwise, can you give me an example how you can configure it to use the context?

[joezimjs]

I actually read through the code more and figured out how to do it without the query:

{
    module: {
        loaders: [...]
    },
    output: {...},
    plugins: [...],
    devtool: 'source-map',
    context: ABS_PATH // <- Add it here
}

This then applies to everything, not just the CSS, but that shouldn't be an issue. It's nice to have the option that you now added, though. Thanks.

[sokra]

css-loader?localIdentName=[path][name]--[local]&context=/abs/path/to/directory