qsddqd
qsddqd
  • 发布:2018-10-11 16:02
  • 更新:2019-05-25 13:28
  • 阅读:5629

怎么可以将已有项目得px改为upx

分类:HBuilderX
upx

怎么可以把mpvue项目中的px快速改为upx,不想计算啊 或者哪个文件下面有这个设置 可以转换啊

2018-10-11 16:02 负责人:无 分享
已邀请:
qsddqd

qsddqd (作者)

具体方法如下
目录HBuilderX.1.0.0.20181010.full\HBuilderX\plugins\uniapp\lib\css-upx-loader.js
代码修改为如下
const css = require('css')
const loaderUtils = require('loader-utils')

//暂时只处理 upx,后续其他平台,需要处理 rpx
const UPX_REGEXP = /\b(\d+(.\d+)?)px\b/
// const UPX_REGEXP = /\b(\d+(.\d+)?)[u|r]px\b/

const getCalcValue = function (type, value) {
const upxGlobalRegExp = new RegExp(UPX_REGEXP.source, 'g')

return value.replace(upxGlobalRegExp, function ($0, $1) {  
    return $1*2 + type  
})  

}

const transformUpx = function (cssText, config) {
const astObj = css.parse(cssText)

function processRules(rules) { // FIXME: keyframes do not support `force upx` comment  
    for (let i = 0; i < rules.length; i++) {  
        const rule = rules[i]  
        if (rule.type === 'media') {  
            processRules(rule.rules) // recursive invocation while dealing with media queries  
            continue  
        } else if (rule.type === 'keyframes') {  
            processRules(rule.keyframes, true) // recursive invocation while dealing with keyframes  
            continue  
        } else if (rule.type !== 'rule' && rule.type !== 'keyframe') {  
            continue  
        }  

        const declarations = rule.declarations  
        for (let j = 0; j < declarations.length; j++) {  
            const declaration = declarations[j]  
            // need transform: declaration && has 'upx'  
            if (declaration.type === 'declaration' && UPX_REGEXP.test(declaration.value)) {  
                declaration.value = getCalcValue(config.unit || 'rpx', declaration.value) // common transform  
            }  
        }  

        // if the origin rule has no declarations, delete it  
        if (!rules[i].declarations.length) {  
            rules.splice(i, 1)  
            i--  
        }  
    }  
}  

processRules(astObj.stylesheet.rules)  

return css.stringify(astObj)  

}
module.exports = function (source) { //TODO 后续有时间调整为 postcss 插件吧
return transformUpx(source, loaderUtils.parseQuery(this.query))
}
修改地方为
const UPX_REGEXP = /\b(\d+(.\d+)?)px\b/

const getCalcValue = function (type, value) {
const upxGlobalRegExp = new RegExp(UPX_REGEXP.source, 'g')

return value.replace(upxGlobalRegExp, function ($0, $1) {  
    return $1*2 + type  
})  

}
这两块

return $1*2 + type

我的代码是375下的 转换为rpx需*2 该值为 ui页面宽度/375

c***@126.com

c***@126.com

新版本找不到这个文件夹了,请问这么搞?

该问题目前已经被锁定, 无法添加新回复