gatsby develop ok, but gatsby build failed

[maidh91]

Description

gatsby develop ok, but gatsby build failed

Environment

Gatsby version: 1.1.28 Node.js version: 8.9.3 Operating System: Ubuntu 16.04

File contents (if changed):

This is the source: https://github.com/aquabubu/home-gatsby

What happened:

'gatsby develop' ok, but 'gatsby build' failed.

success delete html files from previous builds — 0.174 s
success open and validate gatsby-config.js — 0.004 s
success copy gatsby files — 0.031 s
success onPreBootstrap — 0.005 s
success source and transform nodes — 0.587 s
success building schema — 0.296 s
success createLayouts — 0.009 s
success createPages — 0.524 s
success createPagesStatefully — 0.026 s
success onPreExtractQueries — 0.001 s
success update schema — 0.186 s
success extract queries from components — 0.109 s
success run graphql queries — 0.186 s
success write out page data — 0.029 s
success write out redirect data — 0.000 s
success onPostBootstrap — 0.000 s

info bootstrap finished - 3.592 s

Warning: Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs
Warning: Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class
 DONE  Compiled successfully in 11757ms                                                                                                                                                                                                                               23:05:07

You can now view aquabubu in the browser.

  http://localhost:8000/

View GraphiQL, an in-browser IDE, to explore your site's data and schema

  http://localhost:8000/___graphql

Note that the development build is not optimized.
To create a production build, use gatsby build

 WAIT  Compiling...                                                                                                                                                                                                                                                   23:05:07

 DONE  Compiled successfully in 445ms

However, gatsby build failed.

success delete html files from previous builds — 0.119 s
success open and validate gatsby-config.js — 0.005 s
success copy gatsby files — 0.020 s
success onPreBootstrap — 0.005 s
success source and transform nodes — 0.553 s
success building schema — 0.283 s
success createLayouts — 0.011 s
success createPages — 0.516 s
success createPagesStatefully — 0.025 s
success onPreExtractQueries — 0.001 s
success update schema — 0.169 s
success extract queries from components — 0.083 s
success run graphql queries — 0.027 s
success write out page data — 0.008 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.001 s

info bootstrap finished - 3.248 s

success Building CSS — 15.796 s
success Building production JavaScript bundles — 35.495 s
⠂ Building static HTML for pages
error Building static HTML for pages failed

See our docs page on debugging HTML builds for help https://goo.gl/yL9lND

  47 |     const postOverlapClass = mobile ? "post-overlap-mobile" : "post-overlap";
  48 |     const postNode = this.props.data.markdownRemark;
> 49 |     const post = postNode.frontmatter;
     |                           ^
  50 |     if (!post.id) {
  51 |       post.id = slug;
  52 |     }

  WebpackError: Cannot read property 'frontmatter' of undefined

  - post.js:49 PostTemplate.render
    src/templates/post.js:49:27

  - ReactCompositeComponent.js:796 ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext
    ~/react-dom/lib/ReactCompositeComponent.js:796:1

  - ReactCompositeComponent.js:819 ReactCompositeComponentWrapper._renderValidatedComponent
    ~/react-dom/lib/ReactCompositeComponent.js:819:1

  - ReactCompositeComponent.js:359 ReactCompositeComponentWrapper.performInitialMount
    ~/react-dom/lib/ReactCompositeComponent.js:359:1

  - ReactCompositeComponent.js:255 ReactCompositeComponentWrapper.mountComponent
    ~/react-dom/lib/ReactCompositeComponent.js:255:1

  - ReactReconciler.js:43 Object.mountComponent
    ~/react-dom/lib/ReactReconciler.js:43:1

  - ReactMultiChild.js:234 ReactDOMComponent.mountChildren
    ~/react-dom/lib/ReactMultiChild.js:234:1

  - ReactDOMComponent.js:657 ReactDOMComponent._createContentMarkup
    ~/react-dom/lib/ReactDOMComponent.js:657:1

  - ReactDOMComponent.js:524 ReactDOMComponent.mountComponent
    ~/react-dom/lib/ReactDOMComponent.js:524:1

  - ReactReconciler.js:43 Object.mountComponent
    ~/react-dom/lib/ReactReconciler.js:43:1

[ChrisSki]

On occasion, and I can't technically explain why, I have deleted the .cache/ and public/ folders and run the build process again and it's worked as expected.

[aaronklaser]

I had this same issue the other day. Make sure you don't have any empty js files. That seems to break the minify on the build and through errors for things that aren't error.

[MaralS]

@ChrisSki I tried to :

• delete ./cache and /public folder and run the building process by doingrm -R .cache /public && yarn build && yarn serve-> It failed
• delete /node_module by doingrm -R node_modules && yarn install && yarn build && yarn serve -> It failed
• upgrade Gatsby - I have the version 1.1.27 - It failed

Here is the console :

rm -R public .cache && yarn bui
ld && yarn serve
yarn run v1.3.2
$ gatsby buildsuccess delete html files from previous builds — 0.012 s
success open and validate gatsby-config.js — 0.032 s
success copy gatsby files — 0.120 s
success onPreBootstrap — 0.008 ssuccess source and transform nodes — 0.356 s
success building schema — 0.493 s
success createLayouts — 0.014 s
success createPages — 0.146 ssuccess createPagesStatefully — 0.042 s
success onPreExtractQueries — 0.018 s
success update schema — 0.161 s
GraphQL Error There was an error while compiling your site's GraphQL que
ries.
  Invariant Violation: GraphQLParser: Unknown argument `formatString`. S
ource: document `IndexQuery` file: `GraphQL request`.

success extract queries from components — 0.305 s
success run graphql queries — 0.018 s
success write out page data — 0.003 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.001 s

info bootstrap finished - 13.122 s

success Building CSS — 9.087 s
success Building production JavaScript bundles — 18.020 s

error Building static HTML for pages failed

See our docs page on debugging HTML builds for help https://goo.gl/yL9lN
D
  35 | }) {
  36 |   const hostname = 'www.autocontrole-hexagones.fr';
> 37 |   const { markdownRemark: post } = data;
     |           ^
  38 |   const shareUrl = 'https://'+hostname+location.pathname;
  39 |   const title = post.frontmatter.title;
  40 |   const bodyMail = 'Bonjour, voici un article très intéressant. T
u peux le consulter à l\'adresse suivante : '+shareUrl;

  WebpackError: Cannot read property 'markdownRemark' of undefined

  - blog-post.js:37 Template
    src/templates/blog-post.js:37:11

  - ReactCompositeComponent.js:306 ReactCompositeComponentWrapper._const    ructComponentWithoutOwner
    ~/react-dom/lib/ReactCompositeComponent.js:306:1

  - ReactCompositeComponent.js:282 ReactCompositeComponentWrapper._const    ructComponent
    ~/react-dom/lib/ReactCompositeComponent.js:282:1

  - ReactCompositeComponent.js:185 ReactCompositeComponentWrapper.mountC    omponent
    ~/react-dom/lib/ReactCompositeComponent.js:185:1

  - ReactReconciler.js:43 Object.mountComponent
    ~/react-dom/lib/ReactReconciler.js:43:1

  - ReactMultiChild.js:234 ReactDOMComponent.mountChildren
    ~/react-dom/lib/ReactMultiChild.js:234:1

  - ReactDOMComponent.js:657 ReactDOMComponent._createContentMarkup
    ~/react-dom/lib/ReactDOMComponent.js:657:1

  - ReactDOMComponent.js:524 ReactDOMComponent.mountComponent
    ~/react-dom/lib/ReactDOMComponent.js:524:1

  - ReactReconciler.js:43 Object.mountComponent
    ~/react-dom/lib/ReactReconciler.js:43:1

  - ReactMultiChild.js:234 ReactDOMComponent.mountChildren
    ~/react-dom/lib/ReactMultiChild.js:234:1

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

@aaronklaser I don't have empty JS files.

I'm confused because I had no problems until the implementation of Netlify CMS on my Gatsby site. I'm currently on my develop branch, I have no problem on the master one.

[jefflau]

I have the same issue I think.

[jefflau]

@maidh91 Did you manage to fix this?

[jefflau]

@MaralS Any idea how to fix this?

[MaralS]

@jefflau I did not find the solution, yet, I'm keeping working on it :/

[m-allanson]

@maidh91 I tried running your repo but wasn't able to replicate the error you described. Did you find a fix for it?

[jefflau]

@MaralS I fixed mine by removing React.cloneElement(children(), data) which i had put in the index.js layout. I had it there because I wanted to share my graphQL query i had in my layout file to my other pages. Apparently that screwed things up for me. I had a quick look through your repo and didn't see it in there. Not sure if that's any help

[LujunWeng]

@MaralS I had a similar problem. I think this problem comes from

GraphQL Error There was an error while compiling your site's GraphQL que
ries.
  Invariant Violation: GraphQLParser: Unknown argument `formatString`. S
ource: document `IndexQuery` file: `GraphQL request`.

After I fixed all these kinds of errors (yes, there might be more after you fix this one), the build passed.

I guess some process stops after GraphQL Error occurs while the build continue as if there is no error.

[kakadiadarpan]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub issues, we have to clean some of the old issues as many of them have already been resolved with the latest updates.

Please make sure to update to the latest Gatsby version and check if that solves the issue. Let us know if that works for you by adding a comment 👍

[kakadiadarpan]

This issue is being closed because there hasn't been any activity for at least 30 days. Feel free to open a new one if you still experience this problem 👍

[arvigeus]

For any poor soul getting this far without solution: The problem must have been the 404.js file in /pages. The thing is that Gatsby does not render it in dev (instead it shows useful debug page). Make sure you can render that page. What @maidh91 posted seems like complaining about missing frontmatter. Frontmatter is not available in 404.js

[waifo]

I am still facing this issue, asked a question on stackoverflow https://stackoverflow.com/questions/54402112/gatsby-develop-command-runs-but-gatsby-build-gives-error

[erockdotdev]

Kind of a took shot in the dark and here's what worked for me.

I had the a similar issue - development worked fine, no errors. Build and serve also displayed no errors whatsoever, but the page was not loading.

I ran gatsby serve -p 9001 and my page came up. ( Saw it on another thread but for a different issue ).

No idea why 9001 took. I don't have anything running on 9000. But hey, maybe worth a try if you're stuck.

[moiststar]

I had similar issue earlier today with deploy. Did not work in the .vscode terminal. Tried the same command in git bash and worked with no problem. Hope this helps someone.

[MisterRaj]

Similar issue happened to me, in my case I keep getting the 404 file not found error. I created one inside the build, then I keep seeing the same 404 file I created whenever I run. Then I removed some no-script and script tags inside my jsx. then its working fine.

[ccnixon]

I had the same issue. The problem was in my 404 page. I had forgot about that page and wasn't passing in the correct props to the React component it was using. It didn't get triggered during develop because the site is being lazy-loaded not fully compiled.

[billp72]

When i run gatsby develop, it works fine and the site comes up. However, when I run gatsby build, the build fails. The same build script is run in Netlify and fails there also

exports.createPages = async ({ graphql, actions }) => {
  const { createPage } = actions;
  const result = await graphql(`
    query {
      allMarkdownRemark {
        edges {
          node {
            fields {
              slug
            }
          }
        }
      }
    }
  `);
  result.data.allMarkdownRemark.edges.forEach(({ node }) => {
      createPage({
        path: node.fields.slug,
        component: path.resolve('./src/templates/project.js'),
        context: {
          // Data passed to context is available
          // in page queries as GraphQL variables.
          slug: node.fields.slug,
        },
      });
  });
};

[arielcavalcante]

I had this same issue the other day. Make sure you don't have any empty js files. That seems to break the minify on the build and through errors for things that aren't error.

I spent hours suffering not knowing this. THANK YOU.

[ghost]

my gatsby develop is fine but build issue E:\my projects\New folder\geekshub>gatsby develop success open and validate gatsby-configs - 0.073s success load plugins - 2.311s success onPreInit - 0.007s success initialize cache - 0.024s success copy gatsby files - 0.208s success onPreBootstrap - 0.020s success createSchemaCustomization - 0.008s success source and transform nodes - 0.256s success building schema - 0.810s success createPages - 0.006s success createPagesStatefully - 0.218s success onPreExtractQueries - 0.011s success update schema - 0.089s success extract queries from components - 1.248s success write out requires - 0.099s success write out redirect data - 0.022s success Build manifest and related icons - 0.241s success onPostBootstrap - 0.293s ⠀ info bootstrap finished - 25.449 s ⠀ success run queries - 0.075s - 3/3 40.23/s ⠀ You can now view gatsby-starter-default in the browser. ⠀ http://localhost:8000/ ⠀ View GraphiQL, an in-browser IDE, to explore your site's data and schema ⠀ http://localhost:8000/___graphql ⠀ Note that the development build is not optimized. To create a production build, use gatsby build ⠀ warn ESLintError: E:\my projects\New folder\geekshub\src\components\footer\footer.js 38:17 warning img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text

✖ 1 problem (0 errors, 1 warning) success Building development bundle - 44.934s any one who can help me out

[strongSoda]

In my case turns out some empty markdown files were causing the failure. So not only js files but any empty file might cause this.