如何让 vue开发web组件引用第三方组件，样式生效？

Question

vue开发web组件引用第三方组件，如何让样式生效？

我用vue3开发web组件，假设单文件组件为A，A引用layui-vue项目的一个按钮组件，我在A组件的style标签写了scoped，希望所有样式局部生效.

Answer 1

vue3用这个

:deep(选择器)

Answer 2

scss ::v-deep 就是做这个的吧

Answer 3

可以使用:global这个伪类选择器，

<style scoped>
:global(.red) {
  color: red;
}
</style>

具体可以参考这里