Router links not working

[akillian90 (Alan Killian)]

Hello,
Once again I am following along with Lucie Haberer creating a recipe site w/Vue Router & Prismic. The problem I am having is the links on my index.vue page to the individual menu pages dont work. In looking in dev tools I see that in my response the results objects url field is blank where as on the sample site page it returns the relative path to the page(i.e. url "/recipes/gluten-free-oat-dumplings"). So, obviously the anchor tags that prismic-link generate have href="" attributes values. And therein I assume lies the problem.
Also I notice my initial query to Prismic does not include query parameters (https://mybestrecipes.cdn.prismic.io/api/v2/documents/search?ref=YWhMghIAAElp5kmP&q=[[at(document.type, "recipe")]]&pageSize=100) whereas Lucie's example does(https://the-last-straw.cdn.prismic.io/api/v2/documents/search?ref=YRv4vBIAAB8AWKJm&q=[[at(document.type, "recipes")]]&routes=[{"type":"home","path":"/"},{"type":"recipes","path":"/recipes/:uid"}]&pageSize=100). I have also added added "runtimeCompiler :true into vue.config.js file. All to no avail. I dont know if the problem lies with my content modeling because you don't get to see the Prismic schema from the video. Any help in getting this straightened out is appreciated.

P.S. - I have not used a link_resolver.js file like in the video

[Priyanka (Priyanka Maheshwari)]

Hello @akillian90

Thanks for reaching out to us.

I am looking into this. I'll come back to you asap.

Thanks,
Priyanka

[akillian90 (Alan Killian)]

Just so you know the github example exhibits the same behavior that I am running into....github

[akillian90 (Alan Killian)]

Lucie actually replied w/answer on SO

[Priyanka (Priyanka Maheshwari)]

Great @akillian90. I am posting the answer here for other users as well.

The stream used the alpha version of the kit. We have since released some breaking changes to the underlying client kit (because we're in alpha): the routes parameter is no longer nested under defaultParams , you should be fine going with something like this now:

import { createPrismic } from "@prismicio/vue";

const prismic = createPrismic({
  endpoint: "mybestrecipes",
  clientConfig: {
    routes: [
      { type: "home", path: "/" },
      { type: "recipe", path: "/recipe/:uid" },
    ],
  },
});

export default prismic;

The live demo is still working because it still uses an old version of the kit. My team will update it.

Let me know if you have any further questions.

Thanks,
Priyanka