chore: support custom autoModules

Author: 2heal1

README.md

@@ -144,10 +144,50 @@ Enable CSS modules or set options for `postcss-modules`.
 
 ### autoModules
 
-Type: `boolean`<br>
+Type: `boolean` `function` `RegExp`<br>
 Default: `true`
 
-Automatically enable CSS modules for `.module.css` `.module.sss` `.module.scss` `.module.sass` `.module.styl` `.module.stylus` `.module.less` files.
+Allows auto enable CSS modules based on filename.
+
+Possible values: 
+
+* `true` - enable CSS modules for `.module.css` `.module.sss` `.module.scss` `.module.sass` `.module.styl` `.module.stylus` `.module.less` files.
+* `false` - disables CSS Modules.
+* `RegExp` - enable CSS modules for all files matching /RegExp/i.test(filename) regexp.
+* `function` - enable CSS Modules for files based on the filename satisfying your filter function check.
+
+#### `boolean`
+
+Possible values: 
+
+* `true` - enable CSS modules for `.module.css` `.module.sss` `.module.scss` `.module.sass` `.module.styl` `.module.stylus` `.module.less` files.
+* `false` - disables CSS Modules.
+
+```js
+postcss({
+  autoModules: true,
+})
+```
+
+#### `RegExp`
+
+Enable CSS modules for all files matching /RegExp/i.test(filename) regexp.
+
+```js
+postcss({
+  autoModules: /\.custom-module\.\w+$/i,
+})
+```
+
+#### `function`
+
+Enable CSS modules for files based on the filename satisfying your filter function check.
+
+```js
+postcss({
+  autoModules: (file) => file.endsWith(".custom-module.css"),
+})
+```
 
 ### namedExports
 

src/postcss-loader.js

@@ -52,6 +52,26 @@ function isModuleFile(file) {
   return /\.module\.[a-z]{2,6}$/.test(file)
 }
 
+function isAutoModule(autoModules, file) {
+  if (autoModules === false) {
+    return false
+  }
+
+  if (autoModules === true || autoModules === undefined) {
+    return isModuleFile(file)
+  }
+
+  if (typeof autoModules === 'function') {
+    return autoModules(file)
+  }
+
+  if (autoModules instanceof RegExp) {
+    return autoModules.test(file)
+  }
+
+  return false
+}
+
 /* eslint import/no-anonymous-default-export: [2, {"allowObject": true}] */
 export default {
   name: 'postcss',
@@ -72,9 +92,8 @@ export default {
     const shouldInject = options.inject
 
     const modulesExported = {}
-    const autoModules = options.autoModules !== false && options.onlyModules !== true
-    const isAutoModule = autoModules && isModuleFile(this.id)
-    const supportModules = autoModules ? isAutoModule : options.modules
+    const onlyModules = options.onlyModules !== true
+    const supportModules = onlyModules ? isAutoModule(options.autoModules, this.id) : options.modules
     if (supportModules) {
       plugins.unshift(
         require('postcss-modules')({

test/__snapshots__/index.test.js.snap

@@ -712,6 +712,54 @@ console.log(
 "
 `;
 
+exports[`modules custom-auto-modules: js code 1`] = `
+"'use strict';
+
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { 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 css_248z$2 = \\".a-test_foo {\\\\n  color: red;\\\\n}\\\\n\\";
+var a = {\\"foo\\":\\"a-test_foo\\"};
+styleInject(css_248z$2);
+
+var css_248z$1 = \\".b {\\\\n  color: red; }\\\\n\\";
+styleInject(css_248z$1);
+
+var css_248z = \\".c {\\\\n  color: red;\\\\n}\\\\n\\";
+styleInject(css_248z);
+
+console.log(
+  a,
+  css_248z$1,
+  css_248z
+);
+"
+`;
+
 exports[`modules extract: css code 1`] = `
 ".style_foo {
   color: red;
@@ -796,11 +844,10 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = \\".style_foo {\\\\n  color: red;\\\\n}\\\\n\\";
-var style = {\\"foo\\":\\"style_foo\\"};
+var css_248z = \\".foo {\\\\n  color: red;\\\\n}\\\\n\\";
 styleInject(css_248z);
 
-console.log(style.foo);
+console.log(css_248z.foo);
 "
 `;
 

test/fixtures/custom-auto-modules/a.test.css

@@ -0,0 +1,3 @@
+.foo {
+  color: red;
+}

test/fixtures/custom-auto-modules/b.test.scss

@@ -0,0 +1,3 @@
+.b {
+  color: red;
+}

test/fixtures/custom-auto-modules/c.test.less

@@ -0,0 +1,3 @@
+.c {
+  color: red;
+}

test/fixtures/custom-auto-modules/index.js

@@ -0,0 +1,9 @@
+import a from './a.test.css'
+import b from './b.test.scss'
+import c from './c.test.less'
+
+console.log(
+  a,
+  b,
+  c
+)

test/index.test.js

@@ -259,6 +259,19 @@ snapshotMany('modules', [
   {
     title: 'auto-modules',
     input: 'auto-modules/index.js'
+  },
+  {
+    title: 'custom-auto-modules',
+    input: 'custom-auto-modules/index.js',
+    options: {
+      autoModules: filename => {
+        if (/\.test\.[cs|le]s+/.test(filename)) {
+          return true
+        }
+
+        return false
+      }
+    }
   }
 ])
 

types/index.d.ts

@@ -20,7 +20,7 @@ export type PostCSSPluginConf = {
 	modules?: boolean | Record<string, any>;
 	extensions?: string[];
 	plugins?: any[];
-	autoModules?: boolean;
+	autoModules?: boolean | RegExp | ((file: string) => boolean);
 	namedExports?: boolean | ((id: string) => string);
 	minimize?: boolean | any;
 	parser?: string | FunctionType;