vue&tailwindcss&image报错 TypeError: Cannot read property 'nodeName' of undefined

[dagouzhi]

相关平台

微信小程序

复现仓库

https://github.com/icebreaker-template/taro-vue3-tailwind-vscode-template.git
小程序基础库: 3.6.5
使用框架: Vue 3

复现步骤

当在vue中同时使用tailwindcss和image，会报错 newChild 为null

/**
   * @doc https://developer.mozilla.org/zh-CN/docs/Web/API/Node/insertBefore
   * @scenario
   * [A,B,C]
   *   1. insert D before C, D has no parent
   *   2. insert D before C, D has the same parent of C
   *   3. insert D before C, D has the different parent of C
   */
  insertBefore(newChild, refChild, isReplace) {
    if (newChild.nodeName === _constants_index_js__WEBPACK_IMPORTED_MODULE_8__.DOCUMENT_FRAGMENT) {
      newChild.childNodes.reduceRight((previousValue, currentValue) => {
        this.insertBefore(currentValue, previousValue);
        return currentValue;
      }, refChild);
      return newChild;
    }

期望结果

正常使用

实际结果

报错，不渲染

环境信息

👽 Taro v4.0.4


  Taro CLI 4.0.4 environment info:
    System:
      OS: macOS 14.2.1
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 20.16.0 - ~/.nvm/versions/node/v20.16.0/bin/node
      Yarn: 1.22.22 - ~/Library/pnpm/yarn
      npm: 10.8.1 - ~/.nvm/versions/node/v20.16.0/bin/npm
    npmPackages:
      @tarojs/cli: 4.0.7 => 4.0.7 
      @tarojs/components: 4.0.7 => 4.0.7 
      @tarojs/helper: 4.0.7 => 4.0.7 
      @tarojs/plugin-framework-vue3: 4.0.7 => 4.0.7 
      @tarojs/plugin-html: 4.0.7 => 4.0.7 
      @tarojs/plugin-platform-h5: 4.0.7 => 4.0.7 
      @tarojs/plugin-platform-weapp: 4.0.7 => 4.0.7 
      @tarojs/plugin-vue-devtools: ^4.0.8 => 4.0.8 
      @tarojs/runtime: 4.0.7 => 4.0.7 
      @tarojs/shared: 4.0.7 => 4.0.7 
      @tarojs/taro: 4.0.7 => 4.0.7 
      @tarojs/taro-loader: 4.0.8 => 4.0.8 
      @tarojs/vite-runner: 4.0.7 => 4.0.7 
      @tarojs/webpack5-runner: 4.0.8 => 4.0.8 
      babel-preset-taro: 4.0.7 => 4.0.7 

[icezeros]

同样的问题，有解决办法吗

[TimSpan]

一样的问题 加了任何属性就报错哦

[pzgz]

同样碰到了这个问题，感觉并不是tailwind的问题，我拿掉tailwind以后，问题依旧，而且我这边的错误就是拿掉一个view就正常，加上一个就出错了

    <view class="w-full px-3 py-2 bg-white rounded-md shadow-md">
      <view class="mb-2 text-xs font-semibold text-gray-800">行驶证照片</view>
      <view class="flex items-center justify-center"></view>
      <view class="w-full px-3 py-2 bg-white rounded-md bg-secondary-bg max-h-[200px]">
        行驶证照片
      </view>
      <view class="w-full px-3 py-2 bg-white rounded-md bg-secondary-bg max-h-[200px]">
        行驶证照片
      </view>
    </view>

外面还有一层view，我这边就是拿掉里面最后一个view，就正常，一加上去就出错，错误和OP提供的一模一样。

这个问题太恶性，一下把整个项目都挂住了，只能回退到v3

[sunday60004]

同样的问题，Taro4.0.8，微信小程序3.7.4基础库，希望官方能够排查解决

[Ludogage]

同样的问题，Taro4.0.8，微信小程序3.7.4基础库，希望官方能够排查解决

同上

[xiaobaogeit]

针对上面元素不能加class属性，我目前的方法就是直接把有问题的class换成className，就能正常使用了。

 <view  className="xxx">
 </view>

[hyw123456]

给我整笑了，24年的问题还没有解决，解决的是dev环境不报错，build一下还是报错。 最后的结果还是不能用，并且更难定位

[GreatAuk]

同样遇到了，下次项目转 uni 吧😇

[pzgz]

有点难以置信，这么低级的问题，怎么能发布的，我反正已经退回了v3，后续不敢用了