crear páginas en cuestiones de Gatsby; Duplicaciones y contenido sin renderizar.

He tenido algunos errores al tratar de mostrar publicaciones de blog individuales.

Intenté usar la plantilla de página con /post/{post_name} y recibí este error:

advertir Peligro de enrutamiento no determinista: intento de crear la página: “/blog/”, pero la página “/blog” ya existe Esto podría conducir a un comportamiento de enrutamiento no determinista

Lo intenté de nuevo con /blog/{post_name}.

Ahora tengo ambas rutas, que no estoy seguro de cómo limpiar; pero lo que es más importante, en esas páginas, no se muestra nada, aunque debería haber un h1 con su HTML interno establecido en node.title y también un div para el contenido.

He subido mi configuración y componentes a https://github.com/zackrosegithub/gatsby para que puedas echar un vistazo.

No estoy seguro de cómo arreglar

Solo quiero ver mi contenido representado en la pantalla.

Las herramientas de desarrollo no parecen ayudar cuando no hay contenido representado, ya que no puedo encontrar nada que inspeccionar para intentar acceder a él de otra manera.

Gracias por tu ayuda

Su enfoque es parcialmente correcto. Está usando un enfoque basado en promesas, pero cuando usa then() ya lo está resolviendo y resolviendo parcialmente, por lo que no necesita usar la devolución de llamada de resolve()que puede estar causando una duplicación de la función de promesa, así que intente eliminarla.

Además, es posible que desee utilizar un enfoque más amigable usando async/await funciones Algo como:

exports.createPages = async ({ graphql, actions, reporter }) => {
  const yourQuery= await graphql(
          `
            {
              allWordpressPost {
                edges{
                  node{
                    id
                    title
                    slug
                    excerpt
                    content
                  }
                }
              }
            }
          `
  if (yourQuery.errors) {
    reporter.panicOnBuild(`Error while running GraphQL query.`);

    return;
  }
  

          const postTemplate = path.resolve("./src/templates/post.js")
          _.each(yourQuery.data.allWordpressPost.edges, edge => {
            createPage({
              path: `/post/${edge.node.slug}/`,
              component: slash(postTemplate),
              context: edge.node,
            })
          })
        })

 // and so on for the rest of the queries

};

Además, coloque un console.log(pageContext) en tus postTemplate para obtener lo que está llegando a ese punto y nombrar la plantilla como:

const Post = ({pageContext}) => {
 console.log("your pageContext is", pageContext); 
return  <div>
        <h1>
            {pageContext.title}
        </h1>
    </div>
}

export default Post;