[Vue warn]: Failed to resolve component: router-link If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. at <App>
问题:当修改 APP.vue文件中的额部分内容的时候,能够编译出router-link
或者router-view
等,例如注释掉<router-view />
;但是浏览器刷新页面不能够正常显示页面。
<template>
<nav>
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
</nav>
<router-view />
</template>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
}
nav {
padding: 30px;
}
nav a {
font-weight: bold;
color: #2c3e50;
}
nav a.router-link-exact-active {
color: #42b983;
}
</style>
原因:元素挂载放在了前面 app.mount("#app");
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import Antd from "ant-design-vue";
import "ant-design-vue/dist/reset.css";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
const app = createApp(App);
app.use(store);
app.use(router);
app.use(ElementPlus);
app.use(Antd);
app.mount("#app"); // 一定要放在最后