How to get non-minified react errors for Gatsby

Trying to run gatsby build and getting this error message.

failed We’ve encountered an error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7Bid%2C%20frontmatter%2C%20parent%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

To see the full message I have tried: "GATSBY_ENV=development && gatsby build --no-uglify" But this makes no changes.

Message at reactjs.org

Objects are not valid as a React child (found: object with keys {id, frontmatter, parent}). If you meant to render a collection of children, use an array instead.

Many objects in this project have these keys so I have no way of finding where the problem is.

Can anyone advise?

Answer

This is not a Gatsby error but React.

If you don’t have a clue where the issue is, imagine us. Normally, this kind of errors are related in the way you are trying to render an object instead of a property os this object, typically in loops. For example:

const users= [
  {name: 'User 1', surname: 'Surname 1'},
  {name: 'User 2', surname: 'Surname 2'},
  {name: 'User 3', surname: 'Surname 3'},
]

users.map(user => {
   return `the user is ${user}`
})

The snippet above will throw the same exception than you’ve described because user is an object which React can’t infer nor render. You should do something like:

const users= [
  {name: 'User 1', surname: 'Surname 1'},
  {name: 'User 2', surname: 'Surname 2'},
  {name: 'User 3', surname: 'Surname 3'},
]

users.map(user => {
   return `the user name is ${user.name}`
})

This snippet is valid because user.name is a valid return type (string), not an object.