Unknown custom element: <router-link> — did you register the component correctly? For recursive components, make sure to provide the “name” option.
This post is about the errors I encountered while working with vue-router and routers in Laravel using Vue and Vuetify.
This can also be caused by leaving out the Vue.use(VueRouter ) after the import has been made. js if you can see my Vue font is faint meaning it is not been used.
This is how I solved this error, I just added Vue.use(VueRouter ) in my router.
After this another errors below showed up
The above error was solved by adding router to your Vue by running the below command
I left out the router definition in my app.js file and the error below showed in my browser
The browser error was solved by adding the code in the snippet below
This error was solved by adding the router: Router. But my <router-links> were not working or responding as expected.
The router.js code should look like the snippet below
The app should work just fine, but if you encounter an error like the one below
This means all you need to do is to find out whether the @vue/cli-service is installed in your package.json dependencies. Follow the below steps to solve the above error.
Step 1: Add @vue/cli-service as a Vue dependency
Step 2: When you have this message know that it has been added successfully
Step 3: Type Y or Yes when you see the below question
After you have typed Y or Yes, the below message should display.
Step 4: Go to your package.json and check if the dependence has been added.
That’s it, your routes in your app should work just fine. Hopefully this helps when you encounter an error like this. Happy debugging.
