Gatsby: Improve error messages of `createPage` API

Created on 28 Dec 2017  路  7Comments  路  Source: gatsbyjs/gatsby

While experimenting with gatsby by making a simple portfolio site, I made a mistake of not supplying component property to the object passed to createPage function :see_no_evil:
This is what I made my code looked like:

const path = require('path')

exports.createPages = ({ boundActionCreators, graphql }) => {
  const { createPage } = boundActionCreators
  const blogPostTemplate = path.resolve('src/templates/blogPost.js')

  return graphql(`
    {
      allMarkdownRemark {
        edges {
          node {
            html
            frontmatter {
              title
              date
              path
              excerpt
            }
          }
        }
      }
    }
  `).then(result => {
      if (result.errors) {
        return Promise.reject(result.errors)
      }

      const { edges: posts } = result.data.allMarkdownRemark
      posts.forEach(({ node: post }) => {
        const { path } = post.frontmatter
        createPage({
          path,
          template: blogPostTemplate  // should be `component: blogPostTemplate`
        })
      })
  })
}

At that time, I didn't realize the error and was struggling to understand what was going on. The error message I got during the build process looked like:

TypeError: Path must be a string. Received undefined

The above error message is useful but it does not clearly highlight what I was missing.

To maintainers:

What do you think about throwing an error message which reads along the lines of:

Missing required property `component`: Looks like you haven't passed a `component` property to `createPage` function.

We could point the user to the line number of the createPage function invocation.

Note: The above request is not a priority and an enhancement. I'll let you guys decide if it is worth working on it.

good first issue

All 7 comments

Great idea! Probably the best approach here would be to add schema validation in Joi -- possibly only in dev mode? -- for inputs on the createPage function: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/redux/actions.js

eg

https://github.com/hapijs/joi/blob/master/examples/customMessage.js

Re priority, we're heavily into making Gatsby an awesome experience! we'd love a PRs on this @arun1595 or anyone else who is interested

@calcsam I would like to work on this issue.

@GregBorrelly it's yours -- i'll add you to the core team (check your email in the morning) and assign it to you!

@GregBorrelly thanks for taking this on!

Thank you @calcsam !!!!

@calcsam Status update: working on the issue, I got stuck migrating an app at work so that took a while.

Oh actually did a PR for this already 馃槄 forgot to close out this issue. @GregBorrelly can you upgrade to master and tell me what you think about the new error handling? https://github.com/gatsbyjs/gatsby/pull/3773

Was this page helpful?
0 / 5 - 0 ratings

Related issues

benstr picture benstr  路  3Comments

hobochild picture hobochild  路  3Comments

jimfilippou picture jimfilippou  路  3Comments

signalwerk picture signalwerk  路  3Comments

3CordGuy picture 3CordGuy  路  3Comments