Home

Issue: 3139

Extending a vuetify component

[issue link]

Hi folks, I trying to extend a Vuetify component in a nuxt project (nuxt starter template) but i’m getting errors…

My extended component:

// /assets/components/vuetifyExtended/VRadioGroup/VRadioIcon.js

import VRadio from 'vuetify/src/components/VRadioGroup/VRadio';

export default {
  name: 'v-radio-icon',
  extends: VRadio,
  props: {
    iconActive: { type: String, default: 'radio_button_checked' },
    iconInactive: { type: String, default: 'radio_button_unchecked' },
  },
  computed: {
    icon() {
      return this.isActive ? this.iconActive : this.iconInactive;
    },
  },
};

The kind of errors i’m getting:

[...]
 ERROR  Failed to compile with 2 errors          08:29:45

error  in ./node_modules/vuetify/src/util/helpers.js

Module parse failed: Unexpected token (34:28)
You may need an appropriate loader to handle this file type.
|       context.data.on = context.data.on || {}
|       if (!Object.isExtensible(context.data.on)) {
|         context.data.on = { ...context.data.on }
|       }
|
@ ./node_modules/vuetify/src/components/transitions/index.js 1:0-4:27
@ ./node_modules/vuetify/src/components/VRadioGroup/VRadio.js
[...]

I’ve seen that issue but the solution did not solved mine.
Does anyone can help me ? 😃 thx!

This question is available on Nuxt.js community (#c2719)