Я использую плагин gatsby wordpress для извлечения своих сообщений с моего хостингового WP-сайта. Локально, сборка gatsby работает нормально, и все мои поля ACF извлекаются. Однако при моем развертывании Netlify локальный файл свойства кажется пустым. С другими полями ACF поля извлекаются правильно.
Вот мой запрос GraphQL:
{
allWordpressPost {
edges {
node {
id
wordpress_id
date
guid
modified
slug
status
type
link
title
content
acf {
description
title
icon
link
image{
slug
title
localFile{
childImageSharp{
sizes{
sizes
}
resolutions{
srcSet
src
}
}
}
source_url
link
}
}
}
}
}
}
Я уже реализовал исправление функции обнуления в моем файле функций Wordpress, указанном в этом тикете :
function nullify_empty($value, $post_id, $field)
{
if (empty($value)) {
return null;
}
return $value;
}
add_filter('acf/format_value_for_api/type=text', 'nullify_empty', 100, 3);
add_filter('acf/format_value_for_api/type=image', 'nullify_empty', 100, 3);
add_filter('acf/format_value_for_api/type=repeater', 'nullify_empty', 100, 3);
Я заметил, где журналы сборки отличаются на Netlify по сравнению с моим локальным журналом. Вот где я думаю, что проблема заключается в:
Принимая во внимание, что локально это показывает только то же предупреждение:
:
А вот пример полей ACF, которые регистрируются в журнале сборки Netlify. Обратите внимание на свойство localfile:
Моя среда Гэтсби:
System:
OS: macOS Sierra 10.12.6
CPU: x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.8.0 - /usr/local/bin/node
npm: 6.4.1 - /usr/local/bin/npm
Browsers:
Chrome: 68.0.3440.106
Firefox: 59.0
Safari: 11.1.2
npmPackages:
gatsby: ^1.9.167 => 1.9.277
gatsby-image: ^1.0.55 => 1.0.55
gatsby-link: ^1.6.31 => 1.6.32
gatsby-pagination: ^1.1.0 => 1.1.0
gatsby-plugin-catch-links: ^1.0.14 => 1.0.14
gatsby-plugin-feed: ^1.3.15 => 1.3.15
gatsby-plugin-google-analytics: ^1.0.14 => 1.0.15
gatsby-plugin-manifest: ^1.0.10 => 1.0.12
gatsby-plugin-netlify: ^1.0.21 => 1.0.21
gatsby-plugin-netlify-cms: ^2.0.1 => 2.0.1
gatsby-plugin-nprogress: ^1.0.9 => 1.0.9
gatsby-plugin-offline: ^1.0.12 => 1.0.12
gatsby-plugin-react-helmet: ^1.0.2 => 1.0.8
gatsby-plugin-sharp: ^1.6.48 => 1.6.48
gatsby-plugin-sitemap: ^1.2.7 => 1.2.9
gatsby-plugin-twitter: ^1.0.14 => 1.0.14
gatsby-remark-autolink-headers: ^1.4.10 => 1.4.11
gatsby-remark-copy-linked-files: ^1.5.23 => 1.5.25
gatsby-remark-images: ^1.5.34 => 1.5.36
gatsby-remark-prismjs: ^1.2.24 => 1.2.24
gatsby-remark-responsive-iframe: ^1.4.16 => 1.4.16
gatsby-source-filesystem: ^1.5.10 => 1.5.11
gatsby-source-wordpress: ^2.0.93 => 2.0.93
gatsby-transformer-json: ^1.0.14 => 1.0.14
gatsby-transformer-remark: ^1.7.44 => 1.7.44
gatsby-transformer-sharp: ^1.6.27 => 1.6.27
npmGlobalPackages:
gatsby-cli: 1.1.58
Гэтсби-config.js:
const config = require("./data/SiteConfig");
const pathPrefix = config.pathPrefix === "/" ? "" : config.pathPrefix;
module.exports = {
pathPrefix: config.pathPrefix,
siteMetadata: {
siteUrl: config.siteUrl + pathPrefix,
rssMetadata: {
site_url: config.siteUrl + pathPrefix,
feed_url: config.siteUrl + pathPrefix + config.siteRss,
title: config.siteTitle,
description: config.siteDescription,
image_url: `${config.siteUrl + pathPrefix}/logos/logo-512.png`,
author: config.siteRssAuthor,
copyright: `${config.copyright.label} © ${config.copyright.year ||
new Date().getFullYear()}`
}
},
plugins: [
"gatsby-plugin-react-helmet",
{
resolve: `gatsby-source-wordpress`,
options: {
/*
* The base URL of the Wordpress site without the trailingslash and the protocol. This is required.
* Example : 'gatsbyjswpexample.wordpress.com' or 'www.example-site.com'
*/
baseUrl: `hiddenForSO`,
// The protocol. This can be http or https.
protocol: `http`,
// Indicates whether the site is hosted on wordpress.com.
// If false, then the asumption is made that the site is self hosted.
// If true, then the plugin will source its content on wordpress.com using the JSON REST API V2.
// If your site is hosted on wordpress.org, then set this to false.
hostingWPCOM: false,
// If useACF is true, then the source plugin will try to import the Wordpress ACF Plugin contents.
// This feature is untested for sites hosted on Wordpress.com
useACF: true,
excludedRoutes: ["/*/*/comments", "/yoast/**"],
normalizer: function({ entities }) {
return entities;
},
},
},
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-prismjs`,
options: {
// Class prefix for <pre> tags containing syntax highlighting;
// defaults to 'language-' (eg <pre class="language-js">).
// If your site loads Prism into the browser at runtime,
// (eg for use with libraries like react-live),
// you may use this to prevent Prism from re-processing syntax.
// This is an uncommon use-case though;
// If you're unsure, it's best to use the default value.
classPrefix: "language-",
// This is used to allow setting a language for inline code
// (i.e. single backticks) by creating a separator.
// This separator is a string and will do no white-space
// stripping.
// A suggested value for English speakers is the non-ascii
// character '›'.
inlineCodeMarker: null,
// This lets you set up language aliases. For example,
// setting this to '{ sh: "bash" }' will let you use
// the language "sh" which will highlight using the
// bash highlighter.
aliases: {},
},
},
],
},
},
"gatsby-transformer-json",
{
resolve: "gatsby-transformer-remark",
options: {
plugins: [
{
resolve: "gatsby-remark-images",
options: {
maxWidth: 710
}
},
{
resolve: "gatsby-remark-responsive-iframe"
},
"gatsby-remark-prismjs",
"gatsby-remark-copy-linked-files",
"gatsby-remark-autolink-headers"
]
}
},
{
resolve: "gatsby-plugin-google-analytics",
options: {
trackingId: config.googleAnalyticsID
}
},
{
resolve: "gatsby-plugin-nprogress",
options: {
color: config.themeColor
}
},
"gatsby-plugin-sharp",
"gatsby-plugin-catch-links",
'gatsby-transformer-sharp',
"gatsby-plugin-twitter",
"gatsby-plugin-sitemap",
{
resolve: "gatsby-plugin-manifest",
options: {
name: config.siteTitle,
short_name: config.siteTitle,
description: config.siteDescription,
start_url: config.pathPrefix,
background_color: config.backgroundColor,
theme_color: config.themeColor,
display: "minimal-ui",
icons: [
{
src: "/logos/logo-192x192.png",
sizes: "192x192",
type: "image/png"
},
{
src: "/logos/logo-512x512.png",
sizes: "512x512",
type: "image/png"
}
]
}
},
{
resolve: `gatsby-plugin-netlify`,
options: {
headers: {}, // option to add more headers. `Link` headers are transformed by the below criteria
allPageHeaders: [], // option to add headers for all pages. `Link` headers are transformed by the below criteria
mergeSecurityHeaders: true, // boolean to turn off the default security headers
mergeLinkHeaders: true, // boolean to turn off the default gatsby js headers
mergeCachingHeaders: true, // boolean to turn off the default caching headers
transformHeaders: (headers, path) => headers, // optional transform for manipulating headers under each path (e.g.sorting), etc.
generateMatchPathRewrites: true, // boolean to turn off automatic creation of redirect rules for client only paths
},
},
]
};
Гэтсби-node.js
const path = require("path");
const _ = require("lodash");
const fs = require("fs");
const webpackLodashPlugin = require("lodash-webpack-plugin");
const siteConfig = require("./data/SiteConfig");
const {
createPaginationPages,
createLinkedPages
} = require("gatsby-pagination");
exports.createPages = ({ graphql, boundActionCreators }) => {
const { createPage } = boundActionCreators;
return new Promise((resolve, reject) => {
const indexPage = path.resolve("src/templates/index.jsx");
const postPage = path.resolve("src/templates/post.jsx");
const tagPage = path.resolve("src/templates/tag.jsx");
const categoryPage = path.resolve("src/templates/category.jsx");
const authorPage = path.resolve("src/templates/author.jsx");
resolve(
graphql(
`
{
allWordpressPost {
edges {
node {
id
wordpress_id
date
guid
modified
slug
status
type
link
title
content
acf {
description
title
icon
link
team_photo: image{
slug
title
localFile{
childImageSharp{
sizes{
sizes
}
resolutions{
srcSet
src
}
}
}
source_url
link
}
}
}
}
}
}
`
).then(result => {
if (result.errors) {
/* eslint no-console: "off" */
console.log(result.errors);
reject(result.errors);
}
// Creates Index page
createPaginationPages({
createPage,
edges: result.data.allWordpressPost.edges,
component: indexPage,
limit: siteConfig.sitePaginationLimit
});
// Creates Posts
createLinkedPages({
createPage,
edges: result.data.allWordpressPost.edges,
component: postPage,
edgeParser: edge => ({
path: edge.node.slug,
context: {
slug: edge.node.slug,
id: edge.node.id,
}
}),
circular: true
});
_.each(result.data.allWordpressPage.edges, edge => {
// Gatsby uses Redux to manage its internal state.
// Plugins and sites can use functions like "createPage"
// to interact with Gatsby.
createPage({
// Each page is required to have a `path` as well
// as a template component. The `context` is
// optional but is often necessary so the template
// can query data specific to each page.
path: `/${edge.node.slug}/`,
component: slash(pageTemplate),
context: {
id: edge.node.id,
},
})
})*/
})
);
})
};
exports.modifyWebpackConfig = ({ config, stage }) => {
if (stage === "build-javascript") {
config.plugin("Lodash", webpackLodashPlugin, null);
}
};