SliceZone warn 'Extraneous non-props attributes (data-v-inspector) were passed to component'

Developing with Prismic
,
1

Describe your question/issue in detail

Hello!

    "@nuxt/devtools": "^1.5.1",
    "@nuxtjs/prismic": "^3.4.1",
    "nuxt": "^3.13.2",

We are seeing the following warn message polluting our logs. If we disable Nuxt devtools this goes away.

We'd obvs love to keep Nuxt devtools enabled.

Node is running on v20
PNPM is running on v9.10

[Vue warn]: Extraneous non-props attributes (data-v-inspector) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 
  at <SliceZone slices= [ { variation: 'default-slice',

Impacted feature

Our developer logs are unusable with the amount this error is spamming out

What steps have you taken to resolve this issue already?

Disable devtools

Errors

0

Your Role

Project lead

Hosting provider

NA

Package.json file

{
  "name": "nuxt-app",
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare",
    "slicemachine": "start-slicemachine"
  },
  "devDependencies": {
    "@nuxt/devtools": "^1.5.1",
    "@nuxtjs/prismic": "^3.4.1",
    "@nuxtjs/tailwindcss": "^6.8.0",
    "@prismicio/types": "^0.2.9",
    "@samk-dev/nuxt-vcalendar": "^1.0.3",
    "@slicemachine/adapter-nuxt": "^0.3.49",
    "@zadigetvoltaire/nuxt-gtm": "^0.0.13",
    "nuxt": "^3.13.2",
    "nuxt-simple-sitemap": "^4.1.3",
    "prismic-ts-codegen": "^0.1.21",
    "slice-machine-ui": "^1.26.0"
  },
  "dependencies": {
    "@nuxtjs/robots": "^3.0.0",
    "@prismicio/helpers": "^2.3.9",
    "@splidejs/vue-splide": "^0.6.12",
    "@types/headroom.js": "^0.12.4",
    "dayjs": "^1.11.10",
    "headroom.js": "^0.12.0",
    "intl-tel-input": "^18.2.1",
    "smoothscroll-polyfill": "^0.4.4",
    "vue-vimeo-player": "^0.2.2",
    "vue3-prlx": "^0.1.0"
  }
}

Steps to reproduce

Run any page that uses <SliceZone>

2

Hi @jake, this is an issue on Nuxt devtools, it's tracked here: fix: Vue warning: Extraneous non-props attributes (data-v-inspector) · Issue #722 · nuxt/devtools · GitHub

I believe this is the best workaround in the meantime (from the above issue):

devtools: {
  enabled: true,
  componentInspector: false
}

Let us know if anything, hopefully we'll fix this soon on the Devtools's end :smiling_face:

3

Hi Lucie, hope you're well and ah yes that makes sense! thanks for replying :smile:

1 Like