javascript - Gatsby WordPress Source - 灵活的内容布局在不使用时被 graphql 忽略

Question

总结

我使用 ACF 中的灵活内容功能在 WordPress 中设置了大约 15 种不同的布局。因为有这么多，这意味着有些内容作者没有使用。当 gatsby 拉入内容并生成 graphql 数据结构时，它会根据已使用的布局创建结构。当我设置我的查询以提取所有布局时，我得到一个错误，因为查询的某些布局不存在于 graphql 结构中(因为它们没有被作者使用)。这是查询的示例。

acf {
    content_layouts_page {
        __typename
        ... on WordPressAcf_pullout_lead_with_list {
             ...plwlFragment
        }
        ... on WordPressAcf_client_list {
            ...clFragment
        }
        ... on WordPressAcf_titled_list_with_item_description {
             ...tlwidFragment
        }
        ...more layouts defined
    }
}

问题

当作者决定使用未使用的布局时，我如何设置我的 graphql 查询以使其成为“ future 证明”。

可能的解决方案

这是我想到的解决方案，但我不确定是否可行。如果我可以查询 __typename，它将返回一个数组。然后根据当前布局动态构造 graphql 查询。

// __typename array = ['WordPressAcf_pullout_lead_with_list', 'on WordPressAcf_client_list']
let queryString = ''
__typename.forEach(layout => {
    switch (layout) {
        case 'WordPressAcf_pullout_lead_with_list':
            queryString += '...on WordPressAcf_pullout_lead_with_list { ...plwlFragment }'
            break;
        ....
    }
})

// Use queryString in graphql query

同样，不确定这是否可能，但肯定会解决很多问题。

Github 问题

在 Gatsby Github 存储库上也提出了这个问题，并给出了指导。阅读更多 here

Answer 1

自 2019 年 3 月 1 日起，无法动态创建 graphql 查询。这个问题的解决方案是拥有一个包含所有内容布局的“虚拟”页面，并在 graphql 查询中忽略它。尽管您忽略了它，但您的 graphql 架构将包含所有布局结构。

allWordpress(Page|Post)(filter:{slug:{ne:"dummy-page"}}) {
    edges {
        node {
            ...
        }
    }
}