issue on createPage during gatsby develop

[francesco-serialparts]

Hallo everyone, I am Francesco, I am new in this forum. Few weeks ago I started to develop in Gatsby. I am trying to import my wordpress content in a Gatsby site, but I found a problem.

Summary

During develop of my gatsby site (after the connection with a wordpress webiste) I have had an issue. The develop arrives to createPage and does not go further, continues to cycle without giving errors and without finishing the develop.

success open and validate gatsby-configs - 0.046s
success load plugins - 0.760s
warn The Google Analytics plugin requires a tracking ID. Did you mean to add it?
success onPreInit - 0.024s
success initialize cache - 0.039s
success copy gatsby files - 0.211s
warn gatsby-plugin-feed was initialized in gatsby-config.js without a feeds option.
This means that the plugin will use the internal RSS feed creation, which may not match your use case.
This behavior will be removed in the next major release of gatsby-plugin-feed.
For more info, check out: https://gatsby.dev/adding-rss-feed
success onPreBootstrap - 0.022s
success createSchemaCustomization - 0.107s
 -> wordpress__acf_options fetched : 1
 -> wordpress__menus_menus_items fetched : 1
 -> wordpress__menus_menus_items fetched : 1
 -> wordpress__menus_menus fetched : 2

Path: /wp-json/yoast/v1/indexation/posts?per_page=100&page=1
The server response was "404 Not Found"
Inner exception message: "Nessun percorso fornisce una corrispondenza tra l'URL e le modalità di richiesta"
 -> wordpress__POST fetched : 76
 -> wordpress__PAGE fetched : 18
success source and transform nodes - 165.792s
success building schema - 0.666s
createPages (still running for hours!)

Relevant information

I do not understand when start to looking for the problem. The wordpress websites was correctly fetched, the page template is a quite simple import React from "react"

import Header from "../components/header"
import Footer from "../components/footer"
import Container from "../components/container"

export default ({pageContext}) => (
    <Container>
      <Header />
      <h1>
      {pageContext.title}
    </h1>
    <div dangerouslySetInnerHTML ={{__html: pageContext.content}} />
      <Footer />
    </Container> 
  );

Environment (if relevant)

System: OS: Linux 5.4 Ubuntu 20.04 LTS (Focal Fossa) CPU: (4) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz Shell: 5.0.16 - /bin/bash Binaries: Node: 12.16.3 - ~/.nvm/versions/node/v12.16.3/bin/node npm: 6.14.4 - ~/.nvm/versions/node/v12.16.3/bin/npm Browsers: Firefox: 76.0.1 npmGlobalPackages: gatsby-cli: 2.12.38

File contents (if changed)

gatsby-config.js:

module.exports = {
  siteMetadata: {
    title: `My Website`,
    author: {
      name: `Francesco ,
      summary: `.`,
    },
    description: `Serial Parts è un sito di ricambi auto che confronta e propone le migliori marche di ricambi. Serial Parts aiuta gli automobilisti a scoprire le migliori marche evitando i ricambi originali (troppo costosi) e ricambi di scarsa qualità (poco affidabili). Questo significa che non comprerai mai più i ricambi affidandoti al caso, ma potrai scegliere tra le marche selezionate da esperti del settore per te, per garantirti la massima affidabilità al giusto prezzo.`,
    siteUrl: `https://serialparts.com/`,
    social: {
      facebook: `https://www.facebook.com/serialparts`,
    },
  },
  plugins: [
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/blog`,
        name: `blog`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/assets`,
        name: `assets`,
      },
    },
    {
      resolve: `gatsby-transformer-remark`,
      options: {
        plugins: [
          {
            resolve: `gatsby-remark-images`,
            options: {
              maxWidth: 590,
            },
          },
          {
            resolve: `gatsby-remark-responsive-iframe`,
            options: {
              wrapperStyle: `margin-bottom: 1.0725rem`,
            },
          },
          `gatsby-remark-prismjs`,
          `gatsby-remark-copy-linked-files`,
          `gatsby-remark-smartypants`,
        ],
      },
    },
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-plugin-google-analytics`,
      options: {
        //trackingId: `ADD YOUR TRACKING ID HERE`,
      },
    },
    `gatsby-plugin-feed`,
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `Gatsby Starter Blog`,
        short_name: `GatsbyJS`,
        start_url: `/`,
        background_color: `#ffffff`,
        theme_color: `#663399`,
        display: `minimal-ui`,
        icon: `content/assets/gatsby-icon.png`,
      },
    },
    `gatsby-plugin-react-helmet`,
    {
      resolve: `gatsby-plugin-typography`,
      options: {
        pathToConfigModule: `src/utils/typography`,
      },
    },
    // this (optional) plugin enables Progressive Web App + Offline functionality
    // To learn more, visit: https://gatsby.dev/offline
    // `gatsby-plugin-offline`,
// In your gatsby-config.js
    /*
     * Gatsby's data processing layer begins with “source”
     * plugins. Here the site sources its data from WordPress.
     */
    {
      resolve: "gatsby-source-wordpress",
      options: {
        /*
         * The base URL of the WordPress site without the trailingslash and the protocol. This is required.
         * Example : 'demo.wp-api.org' or 'www.example-site.com'
         */
        baseUrl: "127.0.0.1:80",
        // The protocol. This can be http or https.
        protocol: "http",
        // The rest api route prefix that your WordPress site is using.
        // Sometimes this is modified by WordPress plugins.
        // If not set, it uses the default of "wp-json"
        restApiRoutePrefix: "wp-json",
        // Indicates whether the site is hosted on wordpress.com.
        // If false, then the assumption 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.
        // Defaults to true.
        useACF: true,
        // Include specific ACF Option Pages that have a set post ID
        // Regardless if an ID is set, the default options route will still be retrieved
        // Must be using V3 of ACF to REST to include these routes
        // Example: `["option_page_1", "option_page_2"]` will include the proper ACF option
        // routes with the ID option_page_1 and option_page_2
        // The IDs provided to this array should correspond to the `post_id` value when defining your
        // options page using the provided `acf_add_options_page` method, in your WordPress setup
        // Dashes in IDs will be converted to underscores for use in GraphQL
        acfOptionPageIds: [],
        auth: {
          // If auth.user and auth.pass are filled, then the source plugin will be allowed
          // to access endpoints that are protected with .htaccess.
          htaccess_user: "your-htaccess-username",
          htaccess_pass: "your-htaccess-password",
          htaccess_sendImmediately: false,

          // If hostingWPCOM is true then you will need to communicate with wordpress.com API
          // in order to do that you need to create an app (of type Web) at https://developer.wordpress.com/apps/
          // then add your clientId, clientSecret, username, and password here
          // Learn about environment variables: https://www.gatsbyjs.org/docs/environment-variables
          // If two-factor authentication is enabled then you need to create an Application-Specific Password,
          // see https://en.support.wordpress.com/security/two-step-authentication/#application-specific-passwords
          wpcom_app_clientSecret: process.env.WORDPRESS_CLIENT_SECRET,
          wpcom_app_clientId: "54793",
          wpcom_user: "gatsbyjswpexample@gmail.com",
          wpcom_pass: process.env.WORDPRESS_PASSWORD,

          // If you use "JWT Authentication for WP REST API" (https://wordpress.org/plugins/jwt-authentication-for-wp-rest-api/)
          // or (https://github.com/jonathan-dejong/simple-jwt-authentication) requires jwt_base_path, path can be found in WordPress wp-api.
          // plugin, you can specify user and password to obtain access token and use authenticated requests against WordPress REST API.
          jwt_user: process.env.JWT_USER,
          jwt_pass: process.env.JWT_PASSWORD,
          jwt_base_path: "/jwt-auth/v1/token", // Default - can skip if you are using https://wordpress.org/plugins/jwt-authentication-for-wp-rest-api/
        },
        // Set cookies that should be send with requests to WordPress as key value pairs
        cookies: {},
        // Set verboseOutput to true to display a verbose output on `npm run develop` or `npm run build`
        // It can help you debug specific API Endpoints problems.
        verboseOutput: false,
        // Set how many pages are retrieved per API request.
        perPage: 100,
        // Search and Replace Urls across WordPress content.
        searchAndReplaceContentUrls: {
          sourceUrl: "http://127.0.0.1",
          replacementUrl: "http://localhost:8000",
        },
        // Set how many simultaneous requests are sent at once.
        concurrentRequests: 10,
        // Set WP REST API routes whitelists
        // and blacklists using glob patterns.
        // Defaults to whitelist the routes shown
        // in the example below.
        // See: https://github.com/isaacs/minimatch
        // Example:  `["/*/*/comments", "/yoast/**"]`
        // ` will either include or exclude routes ending in `comments` and
        // all routes that begin with `yoast` from fetch.
        // Whitelisted routes using glob patterns
        includedRoutes: [
       //   "**/*/*/categories",
          "**/*/*/posts",
          "**/*/*/pages",
       //   "**/*/*/media",
       //   "**/*/*/tags",
       //   "**/*/*/taxonomies",
       //   "**/*/*/users",
          "**/*/*/menus"
          // "**/*/*/guide"
        ],
        // Blacklisted routes using glob patterns
        excludedRoutes: [],
        // Set this to keep media sizes.
        // This option is particularly useful in case you need access to
        // URLs for thumbnails, or any other media detail.
        // Defaults to false
        keepMediaSizes: false,
        // use a custom normalizer which is applied after the built-in ones.
        normalizer: function ({ entities }) {
          return entities
        },
        // The normalizers option allows you to manipulate the array of internal
        // normalizers that are applied to entities after they're fetched
        // from WordPress.
        // You can add your own normalizers to this array by adding an object
        // that contains name and normalizer properties.
        // Name is the name of your normalizer, and normalizer is a function that
        // should return the array of entities that are passed to it.
        // This is useful if you need more control over the order of normalizers,
        // instead of your normalizer being applied after the built in normalizers (as is the case with the normalizer option).
        normalizers: normalizers => [
          ...normalizers,
          {
            name: "nameOfTheFunction",
            normalizer: function ({ entities }) {
              // manipulate entities here
              return entities
            },
          },
        ],
      },
    },

  ],
}

package.json:

{
  "name": "serialparts-1",
  "private": true,
  "description": "Primo Test Serial Parts partendo dal Gatsby Starter Blog v. 0.1.0",
  "version": "0.1.0",
  "author": "Francesco Arnesano <francesco@serialparts.com>",
  "bugs": {
    "url": "https://github.com/gatsbyjs/gatsby/issues"
  },
  "dependencies": {
    "bluebird": "^3.7.2",
    "gatsby": "^2.21.21",
    "gatsby-image": "^2.4.3",
    "gatsby-plugin-feed": "^2.5.1",
    "gatsby-plugin-google-analytics": "^2.3.1",
    "gatsby-plugin-manifest": "^2.4.2",
    "gatsby-plugin-offline": "^3.2.1",
    "gatsby-plugin-react-helmet": "^3.3.1",
    "gatsby-plugin-sharp": "^2.6.2",
    "gatsby-plugin-sitemap": "^2.4.3",
    "gatsby-plugin-typography": "^2.5.1",
    "gatsby-remark-copy-linked-files": "^2.3.2",
    "gatsby-remark-images": "^3.3.2",
    "gatsby-remark-prismjs": "^3.5.1",
    "gatsby-remark-responsive-iframe": "^2.4.2",
    "gatsby-remark-smartypants": "^2.3.1",
    "gatsby-source-filesystem": "^2.3.1",
    "gatsby-source-wordpress": "^3.3.8",
    "gatsby-transformer-remark": "^2.8.7",
    "gatsby-transformer-sharp": "^2.5.2",
    "prismjs": "^1.20.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-helmet": "^5.2.1",
    "react-typography": "^0.16.19",
    "typeface-merriweather": "0.0.72",
    "typeface-montserrat": "0.0.75",
    "typography": "^0.16.19"
  },
  "devDependencies": {
    "prettier": "2.0.5"
  },
  "homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme",
  "keywords": [
    "gatsby"
  ],
  "license": "MIT",
  "main": "n/a",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/gatsbyjs/gatsby-starter-blog.git"
  },
  "scripts": {
    "build": "gatsby build",
    "develop": "gatsby develop",
    "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "clean": "gatsby clean",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
  }
}

gatsby-node.js:

const path = require(`path`)
const { createFilePath } = require(`gatsby-source-filesystem`)

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

  const blogPost = path.resolve(`./src/templates/blog-post.js`)
  const result = await graphql(
    `
      {
        allMarkdownRemark(
          sort: { fields: [frontmatter___date], order: DESC }
          limit: 1000
        ) {
          edges {
            node {
              fields {
                slug
              }
              frontmatter {
                title
              }
            }
          }
        }
      }
    `
  )

  if (result.errors) {
    throw result.errors
  }

  // Create blog posts pages.
  const posts = result.data.allMarkdownRemark.edges

  posts.forEach((post, index) => {
    const previous = index === posts.length - 1 ? null : posts[index + 1].node
    const next = index === 0 ? null : posts[index - 1].node

    createPage({
      path: post.node.fields.slug,
      component: blogPost,
      context: {
        slug: post.node.fields.slug,
        previous,
        next,
      },
    })
  })
}

exports.onCreateNode = ({ node, actions, getNode }) => {
  const { createNodeField } = actions

  if (node.internal.type === `MarkdownRemark`) {
    const value = createFilePath({ node, getNode })
    createNodeField({
      name: `slug`,
      node,
      value,
    })
  }
}
const _ = require(`lodash`)
const Promise = require(`bluebird`)
const slash = require(`slash`)

// Implement the Gatsby API “createPages”. This is
// called after the Gatsby bootstrap is finished so you have
// access to any information necessary to programmatically
// create pages.
// Will create pages for WordPress pages (route : /{slug})
// Will create pages for WordPress posts (route : /blog/{slug})
exports.createPages = ({ graphql, actions }) => {
  const { createPage } = actions
  return new Promise((resolve, reject) => {
    // The “graphql” function allows us to run arbitrary
    // queries against the local WordPress graphql schema. Think of
    // it like the site has a built-in database constructed
    // from the fetched data that you can run queries against.

    // ==== PAGES (WORDPRESS NATIVE) ====
    graphql(
      `
        {
          allWordpressPage {
            edges {
              node {
                id
                slug
                status
                template
                title
                content
              }
            }
          }
        }
      `
    )
      .then(result => {
        if (result.errors) {
          console.log(result.errors)
          reject(result.errors)
        }

        // Create Page pages.
        const pageTemplate = path.resolve("./src/templates/page.js")
        const guideUnderContentTemplate = path.resolve('./src/templates/guideUnderContent.js')
        // We want to create a detailed page for each
        // page node. We'll just use the WordPress Slug for the slug.
        // The Page ID is prefixed with 'PAGE_'
        _.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(edge.node.template === 'guide_under_content.php' ? guideUnderContentTemplate : pageTemplate),
            context: edge.node,
          })
        })
      })
      // ==== END PAGES ====

      // ==== POSTS (WORDPRESS NATIVE AND ACF) ====
      .then(() => {
        graphql(
          `
          {
            allWordpressPost {
              edges {
                node{
                  title
                  content
                  wordpress_id
                  excerpt
                  date  
                }
              }
            }
          }
          `
        ).then(result => {
          if (result.errors) {
            console.log(result.errors)
            reject(result.errors)
          }
          const blogPostListTemplate = path.resolve ("./src/templates/blogPostList.js") 
          const posts = result.data.allWordpressPost.edges
          const postsPerPage = 2
          const numberOfPages = Math.ceil(posts.length / postsPerPage)

          Array.from({length : numberOfPages}).forEach((page, index) =>  {
            createPage ({
              component: slash(blogPostListTemplate),
              path : index === 0 ? `/blog/` : `/blog/${index + 1}`,
              context: { 
                  posts: posts.slice(index * postsPerPage, (index * postsPerPage) + postsPerPage),
                  numberOfPages,
                  currentPage: index + 1
              }
          })
        })
      })
    })
    // ==== END POSTS ====

        //   // ==== GUIDE (WORDPRESS NATIVE AND ACF) ====
        //   .then(() => {
        //     graphql(
        //       `
        //       {
        //         allWordpressWpGuide {
        //           edges {
        //             node {
        //               id
        //               title
        //               slug
        //               excerpt
        //               content
        //               featured_media{
        //                 source_url
        //               }
        //             }
        //           }
        //         }
        //       } 
        //       `
        //     ).then(result => {
        //       if (result.errors) {
        //         console.log(result.errors)
        //         reject(result.errors)
        //       }
        //       const guidaTemplate = path.resolve("./src/templates/guide.js")
        //       // We want to create a detailed page for each
        //       // post node. We'll just use the WordPress Slug for the slug.
        //       // The Post ID is prefixed with 'POST_'
        //       _.each(result.data.allWordpressWpGuide.edges, edge => {
        //         createPage({
        //           path: `/guide/${edge.node.slug}/`,
        //           component: slash(guidaTemplate),
        //           context: edge.node,
        //         })
        //       })
        //       resolve()
        //     })
        //   })
        // // ==== END GUIDE ====
  })
}

gatsby-browser.js: N/A gatsby-ssr.js: N/A

Thanks in advance

[francesco-serialparts]

Hello, I have solved. The problem was in node.js file, where there was the createPage function.