How to solve "_super.apply is not a function" in the VueJS component (TypeScript)

Question

I am full n00b with VueJS, but have some experience with Angular and the like. Mostly development. Not so much setting up the environment (webpack, gulp, etc.).

I tried to configure VueJS using TypeScript and pretty much work in working condition. I get the desired result, but also get some console errors that I would like to fix.

My simple component consists of these files ...

index.vue

<template src="./countries.component.html"></template>
<script src="./countries.component.ts" lang="ts"></script>

countries.component.html

<section class="countries">
    <div>Countries...</div>
</section>

countries.component.ts

import * as Vue from 'vue';
import Component from 'vue-class-component'

@Component({})
export default class CountriesComponent extends Vue {}

This displays "Countries ..." as it should, but I get these errors in the console:

[Vue warn]: Data error (): (found in D: \ Projects \ sb1 \ SRC \ Components \ countries \ index.vue)

and

TypeError: _super.apply is not a function

Can someone help me on what to do?

, Chromes Developer Tools. - , , ...

, , - : -)

!

Answer 1

... :

import * as Vue from 'vue';

import Vue from 'vue'