make module file configurable martonlederer#14

gsouf · Dec 27, 2021 · ef4951c · ef4951c
1 parent 32d928a
commit ef4951c
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 3 deletions.
diff --git a/README.md b/README.md
@@ -69,6 +69,17 @@ postCssPlugin.default({
 });
 ```
 
+As per standard any file having `module` before the extension (ie `somefile.module.css`) will be treated as a module.
+The option `fileIsModule` allows to override this behavior.
+
+```js
+postCssPlugin.default({
+  // pass a custom `fileIsModule` option to tell whether a file should be treated as a module
+  // in this example we want everything to be a module except file finishing with `global.css`
+  fileIsModule: (filepath) => !filepath.endsWith(".global.css")
+});
+```
+
 ### Preprocessors
 
 To use preprocessors (`sass`, `scss`, `stylus`, `less`), just add the desired preprocessor as a `devDependency`:

diff --git a/src/index.ts b/src/index.ts
@@ -31,6 +31,7 @@ interface PostCSSPluginOptions {
   lessOptions?: Less.Options;
   stylusOptions?: StylusRenderOptions;
   writeToFile?: boolean;
+  fileIsModule?: (filename: string) => boolean;
 }
 
 interface CSSModule {
@@ -47,7 +48,8 @@ export const defaultOptions: PostCSSPluginOptions = {
   sassOptions: {},
   lessOptions: {},
   stylusOptions: {},
-  writeToFile: true
+  writeToFile: true,
+  fileIsModule: null
 };
 
 const postCSSPlugin = ({
@@ -57,7 +59,8 @@ const postCSSPlugin = ({
   sassOptions,
   lessOptions,
   stylusOptions,
-  writeToFile
+  writeToFile,
+  fileIsModule
 }: PostCSSPluginOptions = defaultOptions): Plugin => ({
   name: "postcss2",
   setup(build) {
@@ -101,7 +104,9 @@ const postCSSPlugin = ({
 
         const sourceExt = path.extname(sourceFullPath);
         const sourceBaseName = path.basename(sourceFullPath, sourceExt);
-        const isModule = sourceBaseName.match(/\.module$/);
+        const isModule = fileIsModule
+          ? fileIsModule(sourceFullPath)
+          : sourceBaseName.match(/\.module$/);
         const sourceDir = path.dirname(sourceFullPath);
 
         let tmpFilePath: string;

diff --git a/test/index.js b/test/index.js
@@ -111,6 +111,33 @@ describe("PostCSS esbuild tests", () => {
       })
       .catch(() => process.exit(1));
   });
+
+  it("Works with custom module function", (done) => {
+    let testFilename = null;
+    build({
+      entryPoints: ["tests/basic.ts"],
+      bundle: true,
+      outdir: "dist",
+      plugins: [
+        postCSS.default({
+          plugins: [autoprefixer, postCssImport],
+          modules: true,
+          fileIsModule: (filename) => {
+            testFilename = filename;
+            return false;
+          }
+        })
+      ]
+    })
+      .then(() => {
+        // ensure the proper filename was passed
+        assert.match(testFilename, /styles\/basic\.css/);
+      })
+      .catch((e) => {
+        console.error(e);
+        process.exit(1);
+      });
+  });
 });
 
 function test(entryPoint) {