第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 Gatsby.js 中以編程方式創(chuàng)建多種類型的頁面

在 Gatsby.js 中以編程方式創(chuàng)建多種類型的頁面

慕碼人2483693 2023-06-29 15:37:57
我正在使用 GatsbyJS 構(gòu)建一個網(wǎng)站。我在兩個不同的文件夾中有 markdown 文件:/content/collections并且/content/posts我希望 Gatsby 為每個 markdown 文件創(chuàng)建一個頁面,并使用相應(yīng)的模板(collection.js 和 post.js)。所以我在 gatsby-node.js 文件中寫了這個:const path = require('path');const { createFilePath } = require('gatsby-source-filesystem');exports.onCreateNode = ({ node, getNode, actions }) => {  const { createNodeField } = actions;  if (node.internal.type === 'MarkdownRemark') {    const longSlug = createFilePath({ node, getNode, basePath: 'content' });    const slug = longSlug.split('/');    createNodeField({      node,      name: 'slug',      value: `/${slug[slug.length - 2]}/`,    });  }};exports.createPages = async ({ graphql, actions }) => {  const { createPage } = actions;  const result = await graphql(`    query {      allFile(filter: {relativeDirectory: {eq: "collections"}}) {        edges {          node {            childMarkdownRemark {              fields {                slug              }            }          }        }      }    }  `);  result.data.allFile.edges.forEach(({ node }) => {    createPage({      path: node.childMarkdownRemark.fields.slug,      component: path.resolve('./src/templates/collection.js'),      context: {        slug: node.childMarkdownRemark.fields.slug,      },    });  });};exports.createPages = async ({ graphql, actions }) => {  const { createPage } = actions;  const result = await graphql(`    query {      allFile(filter: {relativeDirectory: {eq: "posts"}}) {        edges {          node {            childMarkdownRemark {              fields {                slug              }            }          }        }      }    }  `);  result.data.allFile.edges.forEach(({ node }) => {    createPage({      path: node.childMarkdownRemark.fields.slug,      component: path.resolve('./src/templates/post.js'),      context: {        slug: node.childMarkdownRemark.fields.slug,      },    });  });};認(rèn)為這會起作用。它確實(shí)適用于我放入的第二種類型。(在這種情況下,它創(chuàng)建帖子,但不創(chuàng)建集合。如果我顛倒調(diào)用 createPages 的順序,它會交換,但它永遠(yuǎn)不會創(chuàng)建所有這些)
查看完整描述

1 回答

?
蕪湖不蕪

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超7個贊

問題是您用第二個函數(shù)聲明覆蓋了第一個函數(shù)聲明。有點(diǎn)像這樣:


var a = "hello"

a = "world"

createPage相反,您應(yīng)該在單個函數(shù)中執(zhí)行所有查詢并調(diào)用要創(chuàng)建的所有頁面,如下所示:


exports.createPages = ({ graphql, actions }) => {

  const { createPage } = actions;


  const collections = graphql(`

    query {

      allFile(filter: {relativeDirectory: {eq: "collections"}}) {

        edges {

          node {

            childMarkdownRemark {

              fields {

                slug

              }

            }

          }

        }

      }

    }

  `).then(result => {

    result.data.allFile.edges.forEach(({ node }) => {

      createPage({

        path: node.childMarkdownRemark.fields.slug,

        component: path.resolve('./src/templates/collection.js'),

        context: {

          slug: node.childMarkdownRemark.fields.slug,

        },

      });

    });

  })


  const posts = graphql(`

    query {

      allFile(filter: {relativeDirectory: {eq: "posts"}}) {

        edges {

          node {

            childMarkdownRemark {

              fields {

                slug

              }

            }

          }

        }

      }

    }

  `).then(result => {

    result.data.allFile.edges.forEach(({ node }) => {

      createPage({

        path: node.childMarkdownRemark.fields.slug,

        component: path.resolve('./src/templates/post.js'),

        context: {

          slug: node.childMarkdownRemark.fields.slug,

        },

      });

    });

  })


  return Promise.all([collections, posts])

};


查看完整回答
反對 回復(fù) 2023-06-29
  • 1 回答
  • 0 關(guān)注
  • 186 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號