Vue路由页面不显示

Question

代码没有报错，但页面不显示。

下面是我写的vue路由但是访问/one内容不显示：App.vue:
<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <World msg="欢迎使用VUEJS"/>
  <pagename pagename="自写组件"/>
  <router-view></router-view>
  
</template>
<script>
import World from '@/components/HelloWorld.vue'
import pagename from '@/components/content.vue'
export default {
  name: 'App',
  components: {
    World,
    pagename
  }
}
</script>
<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
main.js:
import { createApp } from 'vue'
import App from './App.vue'
import { createRouter, createWebHistory } from 'vue-router'
import one from  "@/view/oneA.vue"
import two from  "@/view/twoB.vue"
const app = createApp(App)
const router = createRouter({
    history: createWebHistory(),
    routes:[
        {
            path: "/one",
            component:one
        },
        {
            path: "/two",
            component:two
        }
    ]
})
app.use(router)
app.mount("#app")
oneA.vue:
<template>
    <div>one</div>
</template>
<script>
export default {
  name: 'oneA'
}
</script>
twoB.vue:
<template>
    <div>twoGFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFJ</div>
</template>
<script>
export default {
  name: 'twoB'
}
</script>

Answer 1

你这个是写一个app.vue页面的吗？这个要分开写，不能写一个页面，app.vue是主页面，其他页面的内容显示需要在router页面里面配置，可以看看你的文件夹结构和router页面内容