uniapp 使用uview-plus和unocss之间的冲突报错 $el.querySelector

uniapp 使用uview-plus组件库

安装了unocss

使用图片懒加载加载商品列表会报错,

Uncaught TypeError: $el.querySelector is not a function
    at requestComponentObserver (uni-h5.es.js:6940:20)
    at addIntersectionObserver (uni-h5.es.js:6953:42)
    at ServiceIntersectionObserver.observe (uni-h5.es.js:4733:5)
    at u-lazy-load.vue:1:1

看截图

unocss配置

transformerClass()

• 它用于压缩 class 样式名，把多个类名压缩成一个，提升性能
• <view class="text-red font-bold text-28rpx mt-20rpx" /> 合并为<view class="uno-abc123" />

调整 transformerClass() 具体代码如下

import {presetWeapp} from 'unocss-preset-weapp'
 
import { transformerClass, extractorAttributify } from 'unocss-preset-weapp/transformer';
const { presetWeappAttributify, transformerAttributify } = extractorAttributify()
 
export default ({
  presets: [
		presetWeapp(),
		presetWeappAttributify(),
  ],
  transformers: [
    transformerAttributify(),
    // transformerClass()
      transformerClass({
        // 排除 uview-plus 库中的 class 不处理
        exclude: [
          /uview-plus/,
          /node_modules\/uview-plus/,
        ]
      }),
  ]
  })