首页
前端开发
Webpack
postcss-px2viewport插件生成多种布局单位样式表

postcss-px2viewport插件生成多种布局单位样式表

21 次浏览 0 条评论
zip
zip

postcss-px2viewport 是一个 postcss 插件，结合 viewport.js 使用，默认以 vw 作为布局单位。对于不支持 vw 单位的情况，使用 rem 进行布局。对于标记了 /px/ 的内容，转换为 [data-dpr="1"], [data-dpr="2"], [data-dpr="3"] 三种不同的字体。对于标记了 /no/ 的内容，不做处理，依然使用 px 进行布局。

如何使用 webpack:

请运行 npm install postcss-loader --save-dev，然后添加以下代码：

var px2viewport = require('postcss-px2viewport');
module.exports = {
  module: {
    loaders: [
      {
        test: /.css$/,
        loader: 'postcss-loader',
        options: {
          plugins: [
            px2viewport({})
          ]
        }
      }
    ]
  }
};
zip 文件大小：21.65KB