Nodeschool Public Materials
    Wondering what’s next for npm?Check out our public roadmap! »

    gulp-px-to-rpx

    1.0.7 • Public • Published

    gulp-px-to-rpx

    Build & Test

    install

    $ npm i gulp-px-to-rpx --save-dev
    

    Usage

    把 px 转为微信小程序 rpx,设计稿宽度默认为微信官方推荐的 750 像素

    0px 和 0rpx 转换为 0( 0px -> 0 , 0rpx -> 0 )

    1px 不转换( 1px -> 1px , 1PX -> 1px)

    大写 PX 不转换( 20PX -> 20px )

    rpx 不转换( 10rpx -> 10rpx )

    大于 1px 转换( 10px -> 10rpx , 2px -> 2rpx )

    设计稿宽度为 750 像素:

    const { src, dest } = require('gulp')
    const px2rpx = require('gulp-px-to-rpx')
    const less = require('gulp-less')
    const rename = require('gulp-rename')
    function defaultTask() {
      return src(['./*.less', './*.css', './*.wxss'])
        .pipe(less())
        .pipe(px2rpx())
        .pipe(rename({ extname: '.wxss' }))
        .pipe(dest('./dist'))
    }
    
    exports.default = defaultTask

    设计稿宽度为非 750 像素时(例如设计稿为 375 像素):

    const { src, dest } = require('gulp')
    const px2rpx = require('gulp-px-to-rpx')
    const less = require('gulp-less')
    const rename = require('gulp-rename')
    function defaultTask() {
      return src(['./*.less', './*.css', './*.wxss'])
        .pipe(less())
        .pipe(
          px2rpx({
            designWidth: 375, // 设计稿宽度,默认为750
            precision: 2, //小数最大精度,默认为6
          })
        )
        .pipe(rename({ extname: '.wxss' }))
        .pipe(dest('./dist'))
    }
    
    exports.default = defaultTask

    ** License

    gulp-px-to-rpx is Copyright © Ricksun and licensed under the MIT license. All rights not explicitly granted in the MIT license are reserved. See the included LICENSE file for more details.

    Install

    npm i gulp-px-to-rpx

    DownloadsWeekly Downloads

    0

    Version

    1.0.7

    License

    ISC

    Unpacked Size

    3.74 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar