allow to control how exported named is generated, fixed #64

README.md

@@ -110,12 +110,21 @@ Enable CSS modules or set options for `postcss-modules`.
 
 ### namedExports
 
-Type: `boolean`<br>
+Type: `boolean` `function`<br>
 Default: `false`
 
 Use named exports alongside default export.
 
-When importing specific classNames, the following will happen:
+You can supply a function to control how exported named is generated:
+
+```js
+namedExports(name) {
+  // Maybe you simply want to convert dash to underswcore
+  return name.replace(/-/g, '_')
+}
+```
+
+If you set it to `true`, the following will happen when importing specific classNames:
 
 - dashed class names will be transformed by replacing all the dashes to `$` sign wrapped underlines, eg. `--` => `$__$`
 - js protected names used as your style class names, will be transformed by wrapping the names between `$` signs, eg. `switch` => `$switch$`

src/postcss-loader.js

@@ -103,9 +103,12 @@ export default {
 
     if (options.namedExports) {
       const json = modulesExported[this.id]
+      const getClassName = typeof options.namedExports === 'function' ?
+        options.namedExports :
+        ensureClassName
       // eslint-disable-next-line guard-for-in
       for (const name in json) {
-        const newName = ensureClassName(name)
+        const newName = getClassName(name)
         if (name !== newName) {
           console.warn(`Exported "${name}" as "${newName}" in ${normalizePath(this.id)}`)
         }

test/__snapshots__/index.test.js.snap

@@ -356,6 +356,52 @@ console.log(style$1);
 "
 `;
 
+exports[`modules:named-exports-custom-class-name: js code 1`] = `
+"'use strict';
+
+function __$$styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css) { return }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var foohacked = \\"style_foo__23nAE\\";
+var newhacked = \\"style_new__155Jg\\";
+var css = \\".style_foo__23nAE {\\\\n  color: red;\\\\n}\\\\n\\\\n.style_new__155Jg {\\\\n  color: blue;\\\\n}\\\\n\\";
+var style = {\\"foo\\":\\"style_foo__23nAE\\",\\"new\\":\\"style_new__155Jg\\"};
+__$$styleInject(css);
+
+var style$1 = Object.freeze({
+	foohacked: foohacked,
+	newhacked: newhacked,
+	default: style
+});
+
+console.log(style$1);
+"
+`;
+
 exports[`onExtract 1`] = `
 "'use strict';
 

test/index.test.js

@@ -134,6 +134,17 @@ snapshot({
   }
 })
 
+snapshot({
+  title: 'modules:named-exports-custom-class-name',
+  input: 'named-exports/index.js',
+  options: {
+    modules: true,
+    namedExports(name) {
+      return name + 'hacked'
+    }
+  }
+})
+
 snapshot({
   title: 'modules:extract',
   input: 'css-modules/index.js',