[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(＜inner-selector＞)

uni-app 项目 真机运行 报错

[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(＜inner-selector＞)

报错背景

• 框架 uni-app
• 语法：vue3

报错信息

[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(＜inner-selector＞)

上面这个报错 是以警告形式抛出，在项目打包或项目真机运行时会出现。不影响项目代码运行。

出现原因

::v-deep 知道这个指令的朋友，都知道，这个指令是一个适用于Vue 组件样式穿透指令，常用于使用第三方组件库时，个人去修改第三方组件库的默认样式。

根据警告报错信息翻译，其大概意思是 ::v-deep,:deep作为组合指令已经被弃用了。现在新版本项目中使用::v-deep()代替

旧版本样式穿透写法

::v-deep .abc{
}

:deep .abc{
}

新版本样式穿透写法
::v-deep(.abc){
}

:deep(.abc){
}

链接: 相关文章链接