Vue 3: Component is missing template or render function.

Hello, today i tested vue 3 with typescript and wanted to used components. Unfortunately I always get the message "Component is missing template or render function."

My Vue project has the following structure:

main.ts

import { createApp } from 'vue'
import App from './app'

import router from './router'
import store from './store'

import PageComponent from "@/components/page/page.component";

const turtle = createApp(App);

turtle.use(store);
turtle.use(router);

turtle.component('Page', PageComponent);

turtle.mount('#app');

router/index.ts

import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import Home from '@/views/Home.vue'
import RegisterView from "@/views/authentication/register/register.view";
import LoginView from "@/views/authentication/login/login.view";

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/login',
    name: 'Login',
    component: LoginView
  },
  {
    path: '/register',
    name: 'Home',
    component: RegisterView
  },

]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

export default router

app.ts

import {Vue} from "vue-class-component";


export default class App extends Vue {

  public created() {
    console.log( 'Application created.' );
  }

  public updated() {
    console.log( 'Application updated.' );
  }
}

app.vue

<template>
  <div>
    <h1>App View</h1>
    <router-view/>
  </div>
</template>

<script src="./app.ts"></script>
<style src="./app.less" lang="less"/>

page.component.ts

import { Vue } from 'vue-class-component';
import { Component,  Prop } from 'vue-property-decorator';

export default class Page extends Vue {
  @Prop() public title: string = 'Default Title';

  public created() {
    console.log('Page created.');
  }

  public updated() {
    console.log( 'Page updated.' );
  }
}

page.component.vue

<template>
  <div class="body-wrapper">
    <div class="base">
      <div class="content">
        <section class='page-section'>
          <div class="page-header">
            <h2 class="text-primary">{{ title }}</h2>
          </div>
          <div class="pade-body">
            <slot></slot>
          </div>
        </section>
      </div>
    </div>
  </div>
</template>

<script src="./page.component.ts" lang="ts" ></script>

package.json

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^3.0.0-0",
    "vue-class-component": "^8.0.0-0",
    "vue-property-decorator": "^9.0.0",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0",
    "axios": "^0.19.2",
    "vuex-class": "^0.3.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0-0",
    "lint-staged": "^10.2.11",
    "typescript": "~3.9.3",
    "less": "^3.12.2",
    "less-loader": "^6.2.0",
    "vue-template-compiler": "^2.6.12"
  },
  "lint-staged": {
    "*.ts": [
      "vue-cli-service lint",
      "git add"
    ],
    "*.vue": [
      "vue-cli-service lint",
      "git add"
    ]
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}