postcss / postcss-dark-theme-class

PostCSS plugin to make dark/light theme switcher by copying styles from media query to special class
MIT License
160 stars 16 forks source link

Many duplicate selectors #5

Closed Faisal-Manzer closed 1 year ago

Faisal-Manzer commented 4 years ago

I don't know what's happening but it seems like there is duplicate selector being made. I guess to check for the pre-processed style is not there.

Screenshot 2020-02-01 at 1 43 08 AM

ai commented 4 years ago

How do you use this plugin and what tool you use to compile CSS?

Faisal-Manzer commented 4 years ago

I am using it with preact-cli. Also, I am using node-sass.

# postcss.config.js

module.exports = {
    plugins: [
        require('postcss-viewport-height-correction'),
        require('postcss-normalize')({ forceImport: 'normalize.css' }),
        require('autoprefixer'),
        require('postcss-combine-media-query'),
        require('postcss-dark-theme-class')({ darkClass: 'dt', lightClass: 'lt' }),
        require('postcss-combine-duplicated-selectors')
    ]
};
ai commented 4 years ago

Do you call postcss-cli on already compiled CSS from previous step or you have separated src/ and dist/ folders?

Faisal-Manzer commented 4 years ago

Yeah, the Webpack config first converts sass to CSS then it processed by PostCSS. preact-cli is just like create-react-app so I don't know all those internal workings.

ai commented 4 years ago
  1. What is the input CSS?
  2. Can you disable postcss-combine-duplicated-selectors?