px2vw

by herorest

herorest / px2vw

webpack-px2vw-loader

44 Stars 2 Forks Last release: Not found 6 Commits 0 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

这是一款针对webpack的像素转vw单位的loader插件

安装:

npm i px2vw-view-loader

配置:

按以下loader格式,添加进入webpack配置文件,实现从px转换成vw,适用于移动端项目

javascript
module: {
  rules: [{
    test: /\.css$/,
    loader:'px2vw-view-loader',
      query:{
        viewportWidth: 750,
        viewportUnit: 'vw',
        minPixelValue:1,
        decimal:3
      }
  }]
}
也支持聚合的写法
javascript
module: {
  rules: [{
    test: /\.css$/,
    use: ExtractCSS.extract({
      fallback: "style-loader",
      use: [{
        loader: 'px2vw-view-loader',
        query: {
          viewportWidth: 750,
          viewportUnit: 'vw',
          minPixelValue: 1,
          decimal: 3
        }
      }, {
        loader: "css-loader"
      }]
    })
  }]
}

参数:

| 参数名 | 默认值 | 备注 | | -------- | -----: | :----: | | viewportWidth | 750 | 设计稿宽度,单位像素 | | viewportUnit | 'vw' | 转换单位 | | minPixelValue | 1 | 最小转换单位,例如minPixelValue:1,则1px及以下不进行转换 | | decimal | 3 | 转换后保留的小数位数 |

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.