具体方法如下
目录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
2 个回复
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')
}
const transformUpx = function (cssText, config) {
const astObj = css.parse(cssText)
}
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 $1*2 + type
我的代码是375下的 转换为rpx需*2 该值为 ui页面宽度/375
c***@126.com
新版本找不到这个文件夹了,请问这么搞?