akanix42 / meteor-css-modules

MIT License
92 stars 20 forks source link

PostCSS plugins not working as expected #116

Open sudopseudocode opened 6 years ago

sudopseudocode commented 6 years ago

When I add the following package.json configuration on the readme.md for adding PostCSS plugins, I get a build error.

{
  "devDependencies": {
    "postcss-simple-vars": "1.1.0"
  },
  "cssModules": {
    "postcssPlugins": {
      "postcss-simple-vars": {},
      "postcss-modules-local-by-default": {},
      "postcss-modules-extract-imports": {},
      "postcss-modules-scope": {},
    }
  }
}

This is the build error I keep getting:

/~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Processing Step: CSS Modules / PostCSS compilation
Unable to compile /home/admin/Projects/stencil/node_modules/react-toolbox/src/components/layout/theme.css
CssSyntaxError: postcss-simple-vars: /home/admin/Projects/stencil/node_modules/react-toolbox/src/components/layout/theme.css:161:1: Undefined variable $platform

@define-mixin sidebarIncrements $platform {
^
  & .sidebarDrawer {

/~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

This is an issue with React Toolbox's use of CSS Modules with CSS next, which oddly compiles just fine without any PostCSS plugins added to package.json. But when I revert to the default settings, it still doesn't allow me to use any CSS next in my own CSS modules in the /imports folder.

I'm sure I'm missing something with the set up here, but I can't find anything in the README.md. Any idea what I'm doing incorrectly?

This project is running Meteor 1.6.1, React v16 (with some old Blaze templates), and React Router v4.

akanix42 commented 6 years ago

I haven't had time to look into this yet - it's on my radar but I've been very busy of late