Skip to content

Support camelCase=only|dashesOnly #89

Closed
@evisong

Description

@evisong

Hi,

First of all, thanks for this fantastic lib, in our project we're heavily using babel-plugin-css-modules-transform, which is built on top of this lib.

Actually when setting camelCase=true, I found in bundled JS, camelCase classnames are generated, but the original classnames are not removed, e.g.:

var Styles = {
  'link': 'link-modules__link___3oOIo',
  'linkInGroup': 'link-modules__link-in-group___2fh2a',
  'linkInLinks': 'link-modules__link-in-links___3IT7k',
  'linkDisabled': 'link-modules__link-disabled___2qbP8',
  'link-in-group': 'link-modules__link-in-group___2fh2a',
  'link-in-links': 'link-modules__link-in-links___3IT7k',
  'link-disabled': 'link-modules__link-disabled___2qbP8'
};

This is somehow a duplicate. This may add about 70 kB bundle size when there is 1000 CSS Module classes in the project, which may be even larger in complex project. So I'm thinking if it's possible to just remove the original classnames in bundle.

Just found css-loader supported camelCase=only|dashesOnly (https://github.com/webpack-contrib/css-loader#camelcase) in this ticket webpack-contrib/css-loader#440 and PR webpack-contrib/css-loader#445

'only' Class names will be camelized, the original class name will be removed from the locals

'dashesOnly' Dashes in class names will be camelized, the original class name will be removed from the locals

Is it possible for css-modules-require-hook to support similar options?

Thanks.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions