Using postcss-modules to prefix module CSS, but keep global CSS unprefixed

[rftglyv]

Problem Description:

I'm using postcss-modules to prefix all module CSS (local CSS) files, but I also need to include global CSS without applying any prefixing. I don't want to use the :global syntax to dismiss the module processing for global CSS files because it is inconvenient and requires modifying every global CSS rule.

Expected Behavior:

• Module CSS files (e.g., .module.css) should have class names prefixed according to the generateScopedName rule.
• Global CSS files (e.g., animation.css, reset.css) should remain unprefixed and not be processed by postcss-modules.
• I would like to ensure that my global styles don't need to be marked with :global for exclusion.

Current Solution:

I have configured postcss-modules in .postcssrc as follows:
But it doesn't work expected

{
  "plugins": {
    "postcss-modules": {
      "generateScopedName": "replyment_[name]_[local]__[hash:base64:5]",
      "globalModulePaths": [
        "/src/styles/global/"
      ]
    }
  }
}

This configuration is intended to apply scoped class names for CSS modules but exclude global CSS files (located in /src/styles/global/) from being processed by postcss-modules.

What I'm trying to avoid:

I don't want to manually add :global to every rule in my global CSS. This is inconvenient, especially for large stylesheets, and reduces the maintainability of the code.

:global
.repl-skeleton {
  -webkit-animation: skeleton 2.5s ease-in-out infinite both;
  animation: skeleton 2.5s ease-in-out infinite both;
}
:global
@-webkit-keyframes skeleton {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
:global
@keyframes skeleton {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}

Request:

• Can postcss-modules be configured to automatically treat specific folders (like /src/styles/global/) as global, without the need to mark individual rules with :global?
• Please suggest a solution or enhancement to ensure that global CSS files are excluded from module processing while still applying scoped class names to module CSS.

Additional Information:

• I’m using Parcel as the build tool.
• My CSS structure is separated into module CSS files (e.g., .module.css) and global CSS files (e.g., reset.css, animation.css).
• I need the global styles to remain intact and unmodified by postcss-modules.

Thank you for any assistance or suggestions you can provide!