你好，因为实现上的限制，这个优先级是不确定的。

我想到一个解决方案：

avatar/index.wxml:

<avatar class='avatar ext-class' />

avatar/index.js

Component({
  externalClasses: ['ext-class']
});

avatar/index.wxss

.avatar {
  // 先不定义 --border-radius，去取默认值 10%,--border-radius 由 ext-class 提供
  --border-radius-default: var(--border-radius, 10%);
  // 同理
  --avatar-size-default: var(--border-avatar, 64rpx);

  // 这里不建议直接使用 var(--avatar-size)，因为你可能不止一处用到该值，而且 --avatar-size 并没有直接可观的在头部定义，到时你会想“这个变量在哪？？”
  font-size: var(--avatar-size-default);
  width: 1em;
  height: 1em;
  border-radius: var(--border-radius-default);
  overflow: hidden;
}

这样在外部组件就可以这样使用：

parent/index.wxml

<avatar ext-class='avatar-ext' />

parent/index.wxss

.avatar-ext {
  --avatar-size: 96rpx;
  --border-radius: 100%
}

这样就不用写 important了，也不用在乎优先级。

仅供参考

目前我们就是用important覆盖的，恶心点，也没啥好方法

那就是等同于 externalClass ，基本只能通过 important 去覆盖样式了。