search

evrone / postcss-px-to-viewport

A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units. The best choice to create a scalable interface on different displays by one design size.
https://evrone.com/postcss-px-viewport
MIT License
3.04k stars 406 forks source link

Supported multi options #65

Closed anotherso1a closed 3 years ago

anotherso1a commented 4 years ago

When we have two or more units in our CSS files, they need to be all converted to vw.

And it has no performance impact on the original function.

using example:

module.exports = {
  plugins: {
    // ...
    'postcss-px-to-viewport': [{
      // options 1
    },{
      // options 2
    }]
  }
}
gonnavis commented 3 years ago

Thank you for your pr! I really need this feature!

anotherso1a commented 3 years ago

I am going to close this pr, because postcss itself supports multiple calls to the same plugin.

see code:

const autoprefixer = require('autoprefixer')
const px2viewport = require('postcss-px-to-viewport')

module.exports = {
  plugins: [
    autoprefixer({}),
    px2viewport({
      unitToConvert: 'px',
      viewportWidth: 375,
      unitPrecision: 3,
      viewportUnit: "vw"
    }),
    px2viewport({
      unitToConvert: 'rem',
      viewportWidth: 750,
      unitPrecision: 3,
      viewportUnit: "vw",
      include: 'src'
    })
  ]
}