search

egoist / rollup-plugin-postcss

Seamless integration between Rollup and PostCSS.
MIT License
673 stars 215 forks source link

There is a way to use modules:true that not conflicts with external css files imports from node_modules? #298

Open ricardosouza-logmein opened 4 years ago

ricardosouza-logmein commented 4 years ago

I have this rollup configuration 

postcss({
      extensions: [".css"],
      modules: true,
      extract: false,
    }),

and some of my components are importing a css from a lib

import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";

Using modules: true all the slick-carousel styles are "broken"

jaybeeuu commented 4 years ago

modules can be a postcss-modules settings object - have you tried using globalModulePaths?

e.g. 

postcss({
  extensions: [".css"],
  modules: {
    globalModulePaths: [/slick-carousel/]
  },
  extract: false
}),
ricardosouza-logmein commented 4 years ago

Thanks, it works

grantralls commented 1 year ago

I'm having the same issue. I'm following this tutorial to create a react component library with node 18. I have modules and extract set to true. When I run it I see the CSS output with the hashed names as I expect. When I change modules to be "modules: {}" all of the CSS classes lose their hashed naming. I'm using rollup 3.19 and rollup-plugin-postcss 4.0.2