Skip to content

A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units.

License

Notifications You must be signed in to change notification settings

FrankCheungDev/postcss-px-to-viewport

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

postcss-px-to-viewport NPM version

A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units.

基于evrone/postcss-px-to-viewport修改

  • 增加下方配置解决第三方 ui 库转换后缩小的问题
  • 增加exclude排除文件配置
  • 增加rules 自定义转换规则配置
  • 增加multiple 转换倍数
# 配置参数
'postcss-px-to-viewport-rxdey': {
      viewportWidth: 750,
      unitPrecision: 5,
      viewportUnit: 'vw',
      selectorBlackList: ['.ignore'],
      minPixelValue: 1,
      mediaQuery: false,
      exclude: ['node_modules'],
      multiple: 100,
      rules: {
        path: 'vux',
        fn: (pixels, vw) => {
          return vw*2 + 'vw';
        },
      },
    },

exclude 接收 文件夹名/文件名(带后缀);

exclude 配置优先级大于rules对象中的pathrules配置会被直接排除;

rules 接收对象,path为生效路径,不做配置或为空默认全局生效,参数同exclude;

rules.fn 自定义转换规则,返回转换后的数值,没有返回值则不生效!,pixels:原始像素数值,vw:正常转换后的 vw 值,opt:上方填写的配置参数;

multiple 转换时的倍数,(pixels / viewportSize) * 100原转换公式;

About

A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 82.4%
  • CSS 17.6%