postcss-pxtransform 3.4.2 → 3.4.5

package/README.md

@@ -36,6 +36,22 @@ options = {
 }
 ```
 
+### 动态计算designWidth
+
+基础组件库一般是`375`，如果业务系统UI设计是`750`，可以如下配置后`1:1`切图，小程序、H5、RN时有效
+
+```js
+options = {
+    platform: 'h5',
+    designWidth (input) {
+      if (input.file.replace(/\\+/g, '/').indexOf('@nutui/nutui-taro') > -1) {
+        return 375
+      }
+      return 750
+    },
+}
+```
+
 ### 输入/输出
 
 默认配置下，所有的 px 都会被转换。
@@ -114,7 +130,7 @@ Type: `Object | Null`
 ###  `platform` （String）（必填）
 `weapp` 或 `h5` 或 `rn`
 
-### `designWidth`（Number）（必填）
+### `designWidth`（Number|Function）（必填）
 `640` 或 `750` 或 `828`
 
 ### `unitPrecision` (Number) 

package/index.js

@@ -42,25 +42,30 @@ let targetUnit
 module.exports = postcss.plugin('postcss-pxtransform', function (options = {}) {
   options = Object.assign({}, DEFAULT_WEAPP_OPTIONS, options)
 
+  const isFunctionDw = typeof options.designWidth === 'function'
+  const designWidth = input => isFunctionDw
+    ? options.designWidth(input)
+    : options.designWidth
+
   switch (options.platform) {
     case 'h5': {
-      options.rootValue = baseFontSize * options.designWidth / 640
+      options.rootValue = input => baseFontSize * designWidth(input) / 640
       targetUnit = 'rem'
       break
     }
     case 'rn': {
-      options.rootValue = 1 / options.deviceRatio[options.designWidth] * 2
+      options.rootValue = input => 1 / options.deviceRatio[designWidth(input)] * 2
       targetUnit = 'px'
       break
     }
     case 'quickapp': {
-      options.rootValue = 1
+      options.rootValue = () => 1
       targetUnit = 'px'
       break
     }
     default: {
       // mini-program
-      options.rootValue = 1 / options.deviceRatio[options.designWidth]
+      options.rootValue = input => 1 / options.deviceRatio[designWidth(input)]
       targetUnit = 'rpx'
     }
   }
@@ -69,12 +74,12 @@ module.exports = postcss.plugin('postcss-pxtransform', function (options = {}) {
 
   const opts = Object.assign({}, defaults, options)
   const onePxTransform = typeof options.onePxTransform === 'undefined' ? true : options.onePxTransform
-  const pxReplace = createPxReplace(opts.rootValue, opts.unitPrecision,
-    opts.minPixelValue, onePxTransform)
 
   const satisfyPropList = createPropListMatcher(opts.propList)
 
   return function (css) {
+    const pxReplace = createPxReplace(opts.rootValue, opts.unitPrecision, opts.minPixelValue, onePxTransform)(css.source.input)
+
     for (let i = 0; i < css.nodes.length; i++) {
       if (css.nodes[i].type === 'comment') {
         if (css.nodes[i].text === 'postcss-pxtransform disable') {
@@ -200,15 +205,17 @@ function convertLegacyOptions (options) {
 }
 
 function createPxReplace (rootValue, unitPrecision, minPixelValue, onePxTransform) {
-  return function (m, $1) {
-    if (!$1) return m
-    if (!onePxTransform && parseInt($1, 10) === 1) {
-      return m
+  return function (input) {
+    return function (m, $1) {
+      if (!$1) return m
+      if (!onePxTransform && parseInt($1, 10) === 1) {
+        return m
+      }
+      const pixels = parseFloat($1)
+      if (pixels < minPixelValue) return m
+      const fixedVal = toFixed((pixels / rootValue(input)), unitPrecision)
+      return (fixedVal === 0) ? '0' : fixedVal + targetUnit
     }
-    const pixels = parseFloat($1)
-    if (pixels < minPixelValue) return m
-    const fixedVal = toFixed((pixels / rootValue), unitPrecision)
-    return (fixedVal === 0) ? '0' : fixedVal + targetUnit
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss-pxtransform",
-  "version": "3.4.2",
+  "version": "3.4.5",
   "description": "PostCSS plugin px 转小程序 rpx及h5 rem 单位",
   "keywords": [
     "postcss",
@@ -28,5 +28,5 @@
     "testEnvironment": "node"
   },
   "main": "index.js",
-  "gitHead": "26b329326c6a7da652e8d712ee33df01ab8d2d0e"
+  "gitHead": "789e873f7b9477124b44a900cd4f6a2810e4e06a"
 }