gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.27k stars 10.31k forks source link

Gatsby build fails on netlify but can't reproduce locally - more examples of wepback config customization? #13219

Closed renschler closed 5 years ago

renschler commented 5 years ago

Description

I have a simple gatsby-starter-hello-world repo that builds fine locally but fails to build with Netlify during the static HTML build stage.

Screen Shot 2019-04-07 at 1 28 41 PM

The fail is related to the paper module which I installed with NPM. Interestingly, the bug first surfaced when I pushed a more complex gatsby site to netlify, and the import statement was within a client-only-route. This was confusing to me because I didn't think client-only-routes were touched during the static html build stage.

I found this paperjs issue & solution https://github.com/paperjs/paper.js/issues/1483#issuecomment-429673360 and I think if I can successfully change the webpack config settings like they did in that solution, I will be able to get things to build (maybe... I'm still not sure why things are fine locally but don't work in netlify).

I created a basic example repo (without client only routes) to isolate the issue, and then started going through this help documentation on debugging html builds.

I tried various things with gatsby-node.js, but every time I went to build locally it failed..

exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => { if (stage === "build-html") { actions.setWebpackConfig({ module: { rules: [ { test: /bad-module/, use: loaders.null(), }, ], }, }) } }

I am new to webpack config, so it wasn't clear what I needed to replace the/bad-module/ regex with. I tried a few things, but the build kept failing locally with my changes.

Are there more webpack config customization examples?

Also, I've reviewed existing netlify build issues and it does not seem to be related to those: https://github.com/gatsbyjs/gatsby/issues/13194 https://github.com/gatsbyjs/gatsby/issues/10362 https://github.com/gatsbyjs/gatsby/issues/4989 https://github.com/gatsbyjs/gatsby/issues/6138

Steps to reproduce

Clone repo above, when you push it to netlify the build will fail (same node version). Gatsby build & serve works fine locally.

Expected result

The build should not fail in Netlify. It's not clear why it fails there and not locally.

System: OS: macOS Sierra 10.12.6 CPU: (4) x64 Intel(R) Core(TM) i7-4578U CPU @ 3.00GHz Shell: 3.2.57 - /bin/bash Binaries: Node: 10.13.0 - /usr/local/bin/node Yarn: 1.13.0 - /usr/local/bin/yarn npm: 6.9.0 - /usr/local/bin/npm Languages: Python: 2.7.13 - /Users/Patrick/anaconda2/bin/python Browsers: Chrome: 73.0.3683.86 Firefox: 64.0.2 Safari: 12.0.3 npmPackages: gatsby: ^2.3.5 => 2.3.5 npmGlobalPackages: gatsby-cli: 2.4.14 gatsby: 2.2.11

renschler commented 5 years ago

I ended up adding /node_modules\/paper/ to the rule test above, and things built successfully on netlify!

Still confused though about why it would work locally but not on netlify (also why it wouldn't work on netlify even within a client only route component), so if anyone has any thoughts on that would love to hear them.

gatsbot[bot] commented 5 years ago

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! 💪💜

gatsbot[bot] commented 5 years ago

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it.

Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community!

emmaqbrown commented 3 years ago

@renschler Hey! I'm having this issue and I'm a little confused how you fixed it. Where did you put /node_modules\/paper/?

cyruskorn commented 3 years ago

Hey @emmaqbrown, adding the following code to gatsby-node.js should fix the issue:

exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
  if (stage === "build-html") {
    actions.setWebpackConfig({
      module: { rules: [{ test: /node_modules\/paper/, use: loaders.null() }] },
    })
  }
}
blimpmason commented 3 years ago

I'm having the same issue locally when running gatsby develop despite including the webpack config snippet in my gatsby-node.js:

exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
  if (stage === "build-html") {
    actions.setWebpackConfig({
      module: { rules: [{ test: /node_modules\/paper/, use: loaders.null() }] },
    })
  }
}
davidgodzsak commented 2 years ago

I am having the same issue as @blimpmason did you find a way to get around it?

blimpmason commented 2 years ago

I am having the same issue as @blimpmason did you find a way to get around it?

@davidgodzsak no sorry I never found a workaround!