Изучаю Vue. Это не первый проект. И в первом предыдущем все работало отлично.
Страница отрисовывается лишь раз. А при обновлении пустой экран, хотя в расширении отладчика видно, что App имеет Routing с объектом страницы.
Индекс:
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>E</title>
</head>
<body>
<div id="app">
</div>
</body>
</html>
router.js
import MainPage from "@/pages/Main";
import { createRouter, createWebHistory } from 'vue-router';
const router = createRouter(
{
routes: [
{
path: "/",
component: MainPage,
},
],
history: createWebHistory(process.env.BASE_URL),
}
);
export default router;
main.js
import { createApp } from 'vue'
import router from '@/router/router';
import App from './App.vue';
const app = createApp(App)
app.mount('#app');
app.use(router);
App.vue
<template>
<div>
<router-view></router-view>
</div>
</template>
<script>
</script>
<style>
</style>
Любое изменение в App/vue вновь отрисовывает страницу. (если добавить пробел в <див > или убрать его). Но при обновлении содержимое пропадает.
Консоль постоянно сообщает, что не распознает router-view?:
component: router-view
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
at
Роутер был установлен при создании CLI и дополнительно вручную ввел команды на установку и обновление.
Я несколько часов сравнивал код с предыдущим проектом, и он идентичен в этих моментах. Но предыдущий работает отменно.
Спасибо
Средний
