Search code examples
cssvue.jsnpmnuxt.jsvue-sfc

vue/compiler-sfc ::v-deep usage as a combinator has been deprecated. use :deep(<inner-selector>) instead

I'm using Nuxt 2 and I keep seeing MANY [@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(<inner-selector>) instead. errors while running npm run dev.

I changed all occurrences of ::v-deep { .. } to ::v-deep(.class) { .. } and also the tried the shorthand :deep(.class) { .. } and still those errors are showing up in terminal for over a million time while on npm run dev.

Terminal V-deep errors

I tried:

  • Delete node_modules.
  • Delete Package-lock.json.
  • npm cache verify

But still same problem.

Does anyone knows a way that makes those errors go away? I don't want to downgrade my vue version, it's currently on ^2.6.12.

Solution

  • The issue was fixed in Vue's v2.7.11 release: https://github.com/vuejs/vue/blob/main/CHANGELOG.md#2711-2022-10-11

    With the following commit: sfc: remove sfc scoped deep syntax deprecation warnings