[Vuejs]-Vue error using Vueify Typescript

0๐Ÿ‘

I think your issue is with the class name in Test.vue and the corresponding import statement in MenuComponent.ts.

Try changing the class name to this:

export default class TestComponent extends Vue{}

which would align with the expected exported default here:

import TestComponent from './test.vue'

Or change the above import to:

import test from './test.vue'

and update the component registration:

components: {
    test
}

0๐Ÿ‘

Hope this can help someone else using typescript/vue/gulp.

After many many hours i have found a solution which seems to work for now its modifying the code as follows:

Menu.ts

import Vue from 'vue'
import Menu from './menucomponent.vue'
import TestComponent from './test.vue'
new Menu({components:{TestComponent}}).$mount('#menu');

It seems for some reason it injects the component at this level and can remove the @Component() from MenuComponent.

I am sure there is a simple fix to register the component inside the MenuComponent but for now this works fine.

Leave a comment