Estoy siguiendo junto con Lucie Habere creando un sitio de recetas con Vue Router & Prismic. El problema que tengo es que el componente de enlace prismático en mi página index.vue no genera el campo href de etiquetas de anclaje para el enrutador vue.

Al buscar en las herramientas de desarrollo, veo que en mi respuesta, el campo de URL de los objetos de resultados está en blanco, mientras que en la página del sitio de muestra devuelve la ruta relativa a la página:

(ie url "/recipes/gluten-free-oat-dumplings").

Entonces, obviamente, las etiquetas de anclaje que genera el enlace prismático tienen valores de atributos href="" . Y ahí supongo que radica el problema.

También noté que mi consulta inicial a Prismic no incluye parámetros de consulta:

(https://mybestrecipes.cdn.prismic.io/api/v2/documents/search?ref=YWhMghIAAElp5kmP&q=[[at(document.type, "recipe")]]&pageSize=100)

mientras que el ejemplo de Lucie no

(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).

También agregué "runtimeCompiler: true en el archivo vue.config.js. Todo fue en vano. No sé si el problema radica en mi modelado de contenido porque no puedes ver el esquema Prismic del video. Aquí está mi prismic.js:

 import { createPrismic } from "@prismicio/vue"; const prismic = createPrismic({ endpoint: "mybestrecipes", clientConfig: { defaultParams: { routes: [ { type: "home", path: "/" }, { type: "recipe", path: "/recipe/:uid" }, ], }, }, }); export default prismic;

Aquí hay algunas instantáneas de devtools:

Coincidentemente, cloné su repositorio y ocurrió el mismo problema. Y, sin embargo, el sitio de demostración funciona bien.

Se agradece cualquier ayuda para solucionar esto.