[Vuejs]-How can I resolve the issue of being unable to connect NuxtLink to pages and components in my Nuxt.js project?

If your structure is correct, the name property is not needed and the routes are defined by the folders and files names.

If the linked page exists by folder and file, the link will work.

I assume you want a layout with a navbar in every page.
In the navbar you want the links to the pages.

If this is the case, this basic configuration will work:

app.vue

layout
  default.vue
  
components
  navBar.vue

pages
  index.vue
  contact.vue

• app.vue

<template>
  <div>
    <NuxtPage />
  </div>
</template>

• layout/default.vue

<template>
  <div>
    <NavBar />
    <slot />
  </div>
</template>

• components/navBar.vue

<template>
  <div>
    <NuxtLink to="/">Home</NuxtLink>
    |
    <NuxtLink to="/contact">Contact Us</NuxtLink>
  </div>
</template>

• pages/index.vue

<template>
  <NuxtLayout>
    <div>This is the homepage</div>
  </NuxtLayout>
</template>

• pages/contact.vue

<template>
  <NuxtLayout>
    <div>This is the contact page</div>
  </NuxtLayout>
</template>

Note that I used NuxtPage and NuxtLayout that are very useful in any project structure.

I created a working reproduction for you here

I hope this help.