search

Hacker0x01 / react-datepicker

A simple and reusable datepicker component for React
https://reactdatepicker.com/
MIT License
8.09k stars 2.24k forks source link

Date picker styles not getting applied after built using rollup #4073

Open shettynitin667 opened 1 year ago

shettynitin667 commented 1 year ago

I'm working on a component library where I'm using the Date picker component. I have imported CSS (import 'react-datepicker/dist/react-datepicker.css'). When I run storybook in my project, styles are applied, but when I build it using rollup then the styles are not getting applied. My Rollup postcss config looks like this


postcss({
      modules: true,
      extract: true,
      sourceMap: false,
      minimize: true
 }),
kalupa commented 1 year ago

I'm having the same problem and came looking to see if there was any answers to this problem

karenberry13 commented 1 year ago

Did you ever figure out a fix for this? I'm having the exact same issue and assumed it was the hashing we were applying to our classes. I excluded classes starting with "react-datepicker" from our storybook/webpack so looks great in storybook. When I add the same to rollup.config, it looks like the datepicker styles aren't even getting compiled as I don't see them in the built page with the hashing or otherwise. I then found a bunch of camel case styles (reactDatepicker__time) but not even sure where these are getting applied. I will try to look more into passing styles through rollup, but wanted to see if you ever found a solution. Thanks!

yuki0410-dev commented 7 months ago

This is not a react-datepicker specific issue, but seems to be a rollup plugin setting or issue. Would the following issue be helpful? https://github.com/egoist/rollup-plugin-postcss/issues/298#issuecomment-676210725

( cc @martijnrusschen )