fix(rn): 修复 translate3d 不支持 z 值还在透传的问题

packages/webpack-plugin/lib/platform/style/wx/index.js

@@ -501,21 +501,21 @@ module.exports = function getSpec({ warn, error }) {
           case 'translate':
           case 'scale':
           case 'skew':
-          case 'translate3d': // x y 支持 z不支持
-          case 'scale3d': // x y 支持 z不支持
+          case 'translate3d': // x/y 支持，z 不支持
+          case 'scale3d': // x/y 支持，z 不支持
             {
               // 2 个以上的值处理
               key = key.replace('3d', '')
-              const vals = parseValues(val, ',').splice(0, 3)
+              const vals = parseValues(val, ',')
+              if (vals.length > 2) {
+                unsupportedPropError({ prop: `${key}Z`, value, selector }, { mode })
+              }
               // scale(.5) === scaleX(.5) scaleY(.5)
               if (vals.length === 1 && key === 'scale') {
                 vals.push(vals[0])
               }
               const xyz = ['X', 'Y', 'Z']
-              transform.push(...vals.map((v, index) => {
-                if (key !== 'rotate' && index > 1) {
-                  unsupportedPropError({ prop: `${key}Z`, value, selector }, { mode })
-                }
+              transform.push(...vals.slice(0, 2).map((v, index) => {
                 return { [`${key}${xyz[index] || ''}`]: v.trim() }
               }))
               break

packages/webpack-plugin/lib/runtime/components/react/utils.tsx

@@ -410,12 +410,12 @@ function parseTransform (transformStr: string) {
         case 'translate':
         case 'scale':
         case 'skew':
-        case 'translate3d': // x y 支持 z不支持
-        case 'scale3d': // x y 支持 z不支持
+        case 'translate3d': // x/y 支持，z 不支持
+        case 'scale3d': // x/y 支持，z 不支持
         {
           // 2 个以上的值处理
           key = key.replace('3d', '')
-          const vals = parseValues(val, ',').splice(0, 3)
+          const vals = parseValues(val, ',').splice(0, 2)
           // scale(.5) === scaleX(.5) scaleY(.5)
           if (vals.length === 1 && key === 'scale') {
             vals.push(vals[0])

packages/webpack-plugin/test/platform/wx/style/style-rn.spec.js

@@ -246,6 +246,29 @@ describe('React Native style validation for CSS variables', () => {
     })
   })
 
+   describe('Transform z-axis handling', () => {
+    test('should drop unsupported z-axis values from 3d transforms', () => {
+      const css = '.box { transform: translate3d(1px, 2px, 3px) scale3d(1, 2, 3); }'
+      const config = createConfig()
+
+      const result = getClassMap({
+        content: css,
+        filename: 'test.css',
+        ...config
+      })
+
+      expect(result.box.transform).toEqual([
+        { translateX: '1' },
+        { translateY: '2' },
+        { scaleX: '1' },
+        { scaleY: '2' }
+      ])
+      expect(config.error).toHaveBeenCalledTimes(2)
+      expect(config.error.mock.calls[0][0]).toEqual(expect.stringContaining('translateZ'))
+      expect(config.error.mock.calls[1][0]).toEqual(expect.stringContaining('scaleZ'))
+    })
+  })
+
   describe('Background shorthand', () => {
     test('should expand background-position and background-size from slash shorthand', () => {
       const css = '.bg { background: url(https://example.com/bg.png) no-repeat center/cover #fff; }'