Duplicate attribute (Vue template) Vue Origin: On your device OSI layer 7 · Application Last updated 5 Nov 2026

Vue: [plugin:vite:vue] Duplicate attribute. / [vue/no-duplicate-attributes] Duplicate attribute 'class'

The same attribute appears twice on an element in a template.

Exact message you may see [plugin:vite:vue] Duplicate attribute.Duplicate attribute.[vue/no-duplicate-attributes] Duplicate attribute 'class'Duplicate attribute 'id' Vue template
Explore the map of this error Full error map →
Seen on: Vue

Meaning

Merge them: for class/style use a single binding or :class="['a', b]"; class="a" :class="b" is allowed (static + bound), but two static class attributes are not. Remove duplicates of props and event listeners.

Common causes

  • Two static class or id attributes
  • Duplicate prop pass-through
  • Copy-paste error
  • Conflicting v-bind object with explicit attr
  • Lint rule flagging duplicates

⚡ Quick fix

  1. Combine into one attribute
  2. Use :class="[...]" arrays
  3. Remove the duplicate

Detailed fix by platform

Vue

  1. <div class="card" :class="{ active: isActive }">

How to diagnose

  1. Attribute — Duplicate?
  2. Merge — Array binding?
  3. Props — Repeated?

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

Where this error sits

Origin: On your device. Errors that are often confused with or caused by this one (click to open):

[Vue warn]: <TransitionGroup> children must be keyed — Vue: [Vue warn]: <TransitionGroup> children must be keyed: <li> (Vue)[Vue warn]: <Transiti…[Vue warn]: Failed to locate Teleport target with selector — Vue: [Vue warn]: Failed to locate Teleport target with selector "#modal". Note the target element must exist before the component is mounted (Vue)[Vue warn]: Failed to…Cannot find module './App.vue' or its corresponding type declarations — TypeScript: error TS2307: Cannot find module './App.vue' or its corresponding type declarations. (Vue)Cannot find module '.…Element is missing end tag — Vue: [plugin:vite:vue] Element is missing end tag. / Invalid end tag. (Vue)Element is missing en…ESLint Parsing error in .vue files — ESLint: Parsing error: Unexpected token < / Parsing error: '>' expected (vue-eslint-parser not configured) (Vue)ESLint Parsing error …Failed to fetch dynamically imported module / async component failed — Vue: TypeError: Failed to fetch dynamically imported module: https://app.example.com/assets/Settings-abc123.js (Vue)Failed to fetch dynam…Feature flags __VUE_OPTIONS_API__ not explicitly defined (esm-bundler) — Vue: You are running the esm-bundler build of Vue — configure your bundler to explicitly replace feature flag globals (__VUE_OPTIONS_API__) (Vue)Feature flags __VUE_O…Property was accessed during render but is not defined — Vue: [Vue warn]: Property "x" was accessed during render but is not defined on instance (Vue)Property was accessed…Duplicate…

Explore the map of this error Full error map →

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.

💬 What worked for others

No tips yet — did something else fix this for you?

Share what worked for you

Tips are checked by an editor before they appear. Links are removed.