Skip to content

Allow named exports to have underscores in names #1206

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
Finesse opened this issue Oct 10, 2020 · 0 comments · Fixed by #1209
Closed

Allow named exports to have underscores in names #1206

Finesse opened this issue Oct 10, 2020 · 0 comments · Fixed by #1209

Comments

@Finesse
Copy link

Finesse commented Oct 10, 2020

  • Operating System: macOS 10.15.6
  • Node Version: 12.18.4
  • NPM Version: 6.14.6
  • webpack Version: 4.44.2
  • css-loader Version: 4.3.0

Feature Proposal

When I set css-loader options like this:

{
    loader: 'css-loader',
    options: {
        modules: {
            namedExport: true,
            exportLocalsConvention: 'dashesOnly',
        },
    }
},

The loader emits an error for each CSS file: The "modules.namedExport" option requires the "modules.exportLocalsConvention" option to be "camelCaseOnly".

I understand that class names mustn't contain dashes and many other characters to be able to be constant names, but underscore (_) is allowed and I want to use it in constant names.

In order to achieve this, there can be a value like leaveUnderscore for the exportLocalsConvention option that shall camelize everything except underscores and be accepted when namedExports is true.

Feature Use Case

BEM. Even though CSS modules make BEM be completely meaningless, underscore can be used to split logical parts in CSS class names, especially when CSS is produced by a preprocessor. For example, here is my SCSS:

.bigButton {
    &_label {
    }
}
.label {
    &_icon {
    }
}

I want to use the class names as is:

import {bigButton, bigButton_label, label, label_icon} from './style.scss?module';

Having 2 ways to split words (camelCase and under_score) is very handy for giving meaningful names to CSS items.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant