如何解决这样的文件或目录“ router.js”

Question

I was working on my Nuxt project, when after adding a new file.vue, i had this error:

Failed to compile with 1 errors                                              friendly-errors 16:19:30


 ERROR  in ./.nuxt/router.js                                                         friendly-errors 16:19:30

Module build failed (from ./node_modules/eslint-loader/index.js):                    friendly-errors 16:19:30
Error: ENOENT: no such file or directory, open '/Users/jacopotabani/Desktop/my-movie-app-PWA-v2/.nuxt/router.js

If i look in the folder .nuxt, the file 'router.js'disappeared. I have tried to copy the router.js file from a copy of the project that i had made before, but after reloading the app, the file 'router.js' changes automatically in 'router 4.js'.

How can i solve?

Answer 1

When you are using Nuxt.js , typically you should use pages directory, that Nuxt uses to generate router config object. Reference

Nuxt.js automatically generates the vue-router configuration based on your file tree of Vue files inside the pages directory.

For example, let's consider that you have following file tree:

pages/
--| user/
-----| index.vue
-----| one.vue
--| index.vue

Following router config will be generated:

router: {
  routes: [
    {
      name: 'index',
      path: '/',
      component: 'pages/index.vue'
    },
    {
      name: 'user',
      path: '/user',
      component: 'pages/user/index.vue'
    },
    {
      name: 'user-one',
      path: '/user/one',
      component: 'pages/user/one.vue'
    }
  ]
}