Deploying to Netlify gets stuck after [BABEL] Note: The code generator has deoptimised the styling of /opt/build/repo/node_modules/react-intl/locale-data/index.js as it exceeds the max of 500KB.
After running a successful gatsby build and gatsby serve on my project https://github.com/rkretch91/wc, I then try to deploy to Netlify and it pauses on the following line of code for a long time before timing out 15 or 20 minutes later [BABEL] Note: The code generator has deoptimised the styling of /opt/build/repo/node_modules/react-intl/locale-data/index.js as it exceeds the max of 500KB.
I haven't touched any of the root files since the last successful deploy. The only thing I altered slightly was some styling and functionality on my map component (mapbox) and like I said, the local build was successful.
Cannot find an issue that is exactly related here.
System:
OS: macOS 10.14.3
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Shell: 5.3 - /bin/zsh
Binaries:
Node: 11.13.0 - /usr/local/bin/node
npm: 6.7.0 - /usr/local/bin/npm
Languages:
Python: 2.7.10 - /usr/bin/python
Browsers:
Chrome: 75.0.3770.100
Safari: 12.0.3
npmPackages:
gatsby: ^2.0.102 => 2.0.102
gatsby-link: ^2.0.9 => 2.0.9
gatsby-plugin-i18n: ^1.0.1 => 1.0.1
gatsby-plugin-react-helmet: ^3.0.5 => 3.0.5
gatsby-plugin-sass: ^2.0.11 => 2.0.11
gatsby-source-filesystem: ^2.0.37 => 2.0.37
gatsby-transformer-remark: ^2.3.12 => 2.3.12
npmGlobalPackages:
gatsby-cli: 2.5.6
Netlify Deploy Log
12:24:07 PM: Build ready to start
12:24:09 PM: build-image version: 9e0f207a27642d0115b1ca97cd5e8cebbe492f63
12:24:09 PM: build-image tag: v3.3.2
12:24:09 PM: buildbot version: ef8d0929ed0baabafd8bbb7d0b021e1fc24180c0
12:24:09 PM: Fetching cached dependencies
12:24:09 PM: Starting to download cache of 255.0KB
12:24:09 PM: Finished downloading cache in 80.871327ms
12:24:09 PM: Starting to extract cache
12:24:09 PM: Failed to fetch cache, continuing with build
12:24:09 PM: Starting to prepare the repo for build
12:24:10 PM: No cached dependencies found. Cloning fresh repo
12:24:10 PM: git clone https://github.com/rkretch91/wc
12:24:11 PM: Preparing Git Reference refs/heads/master
12:24:12 PM: Starting build script
12:24:12 PM: Installing dependencies
12:24:13 PM: Downloading and installing node v10.16.0...
12:24:14 PM: Downloading https://nodejs.org/dist/v10.16.0/node-v10.16.0-linux-x64.tar.xz...
12:24:14 PM:
12:24:14 PM: 3.1%
12:24:14 PM:
################
12:24:14 PM: ############################### 66.6%
12:24:14 PM:
######################################
12:24:14 PM: ################################## 100.0%
12:24:14 PM: Computing checksum with sha256sum
12:24:14 PM: Checksums matched!
12:24:17 PM: Now using node v10.16.0 (npm v6.9.0)
12:24:17 PM: Attempting ruby version 2.6.2, read from environment
12:24:19 PM: Using ruby version 2.6.2
12:24:19 PM: Using PHP version 5.6
12:24:19 PM: Started restoring cached node modules
12:24:19 PM: Finished restoring cached node modules
12:24:19 PM: Started restoring cached yarn cache
12:24:19 PM: Finished restoring cached yarn cache
12:24:19 PM: Installing yarn at version 1.13.0
12:24:19 PM: Installing Yarn!
12:24:19 PM: > Downloading tarball...
12:24:19 PM: [1/2]: https://yarnpkg.com/downloads/1.13.0/yar
12:24:19 PM: n-v1.13.0.tar.gz --> /tmp/yarn.tar.gz.AGVAlYmTsk
12:24:19 PM: % Total % Received % Xf
12:24:19 PM: erd Average Speed Time Time Time Current
12:24:19 PM: Dload
12:24:19 PM: Upload Total Spent Left Speed
12:24:19 PM:
0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--:-- 0
12:24:19 PM:
0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--
12:24:19 PM: :-- 0
12:24:19 PM:
100 93 100 93 0 0 36
12:24:19 PM: 5 0 --:--:-- --:--:-- --:--:-- 364
12:24:20 PM:
100 609 0 609 0 0 1013
12:24:20 PM: 0 --:--:-- --:--:-- --:--:-- 1013
12:24:20 PM:
100 1142k 100 1142k 0 0 1072k 0 0:00:01 0:00:01 --:--:-
12:24:20 PM: - 1072k
100 1142k 100 1142k 0 0 1072k 0 0:00:01 0:00:01 --:--:-- 0
12:24:20 PM: [2/2]: https://yarnpkg.com/downloads/1.13.0/yarn-v1.13.0.tar.gz.asc --> /tmp/yarn.tar.gz.AGVAlYmTsk.asc
12:24:20 PM:
100 97 100 97 0 0 1589 0 --:--:-- --:--:-- --:--:-- 1589
12:24:20 PM:
100 613 0 613 0 0 3708 0 --:--:-- --:--:
12:24:20 PM: -- --:--:-- 3708
12:24:20 PM:
100 832 100 832 0 0 3640 0 --:--:-- --:--:--
12:24:20 PM: --:--:-- 3640
12:24:20 PM: > Verifying integrity...
12:24:21 PM: gpg: Signature made Tue 18 Dec 2018 04:04:55 PM UTC using RSA key ID B6FF4DE3
12:24:21 PM: gpg: Good signature from "Yarn Packaging <[email protected]>"
12:24:21 PM: gpg: Note: This key has expired!
12:24:21 PM: Primary key fingerprint: 72EC F46A 56B4 AD39 C907 BBB7 1646 B01B 86E5 0310
12:24:21 PM: Subkey fingerprint: E219 30C4 D0A4 AA46 1858 1F7A E074 D16E B6FF 4DE3
12:24:21 PM: > GPG signature looks good
12:24:21 PM: > Extracting to ~/.yarn...
12:24:21 PM: > Adding to $PATH...
12:24:21 PM: > We've added the following to your /opt/buildhome/.profile
12:24:21 PM: > If this isn't the profile of your current shell then please add the following to your correct profile:
12:24:21 PM: export PATH="$HOME/.yarn/bin:$HOME/.config/yarn/global/node_modules/.bin:$PATH"
12:24:21 PM:
12:24:21 PM: > Successfully installed Yarn 1.13.0! Please open another terminal where the yarn command will now be available.
12:24:22 PM: Installing NPM modules using Yarn version 1.13.0
12:24:22 PM: yarn install v1.13.0
12:24:22 PM: warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
12:24:22 PM: [1/4] Resolving packages...
12:24:23 PM: warning gatsby > @babel/[email protected]: ๐จ As of Babel 7.4.0, this
12:24:23 PM: package has been deprecated in favor of directly
12:24:23 PM: including core-js/stable (to polyfill ECMAScript
12:24:23 PM: features) and regenerator-runtime/runtime
12:24:23 PM: (needed to use transpiled generator functions):
12:24:23 PM: > import "core-js/stable";
12:24:23 PM: > import "regenerator-runtime/runtime";
12:24:23 PM: warning gatsby > @hapi/[email protected]: This version is no longer maintained
12:24:23 PM: warning gatsby > @gatsbyjs/relay-compiler > @babel/[email protected]: ๐จ As of Babel 7.4.0, this
12:24:23 PM: package has been deprecated in favor of directly
12:24:23 PM: including core-js/stable (to polyfill ECMAScript
12:24:23 PM: features) and regenerator-runtime/runtime
12:24:23 PM: (needed to use transpiled generator functions):
12:24:23 PM: > import "core-js/stable";
12:24:23 PM: > import "regenerator-runtime/runtime";
12:24:29 PM: warning react-intl > [email protected]: This package has been deprecated, please see migration guide at 'https://github.com/formatjs/formatjs/tree/master/packages/intl-relativeformat#migration-guide'
12:24:30 PM: [2/4] Fetching packages...
12:24:52 PM: info [email protected]: The platform "linux" is incompatible with this module.
12:24:52 PM: info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
12:24:52 PM: [3/4] Linking dependencies...
12:24:52 PM: warning " > [email protected]" has unmet peer dependency "@reach/router@^1.1.1".
12:24:52 PM: warning "gatsby-plugin-sass > [email protected]" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
12:24:52 PM: warning " > [email protected]" has unmet peer dependency "prop-types@^15.5.4".
12:25:04 PM: [4/4] Building fresh packages...
12:25:08 PM: success Saved lockfile.
12:25:08 PM: Done in 45.76s.
12:25:08 PM: NPM modules installed using Yarn
12:25:08 PM: Started restoring cached go cache
12:25:08 PM: Finished restoring cached go cache
12:25:08 PM: unset GOOS;
12:25:08 PM: unset GOARCH;
12:25:08 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.12.linux.amd64';
12:25:08 PM: export PATH="/opt/buildhome/.gimme/versions/go1.12.linux.amd64/bin:${PATH}";
12:25:08 PM: go version >&2;
12:25:08 PM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.12.linux.amd64.env';
12:25:08 PM: go version go1.12 linux/amd64
12:25:08 PM: Installing missing commands
12:25:08 PM: Verify run directory
12:25:08 PM: Executing user command: gatsby build
12:25:11 PM: success open and validate gatsby-configs โ 0.005
12:25:11 PM: success load plugins โ 0.431
12:25:11 PM: success onPreInit โ 0.010
12:25:11 PM: success delete html and css files from previous builds โ 0.282
12:25:11 PM: success initialize cache โ 0.009
12:25:12 PM: success copy gatsby files โ 0.019
12:25:12 PM: success onPreBootstrap โ 0.009
12:25:12 PM: success source and transform nodes โ 0.304
12:25:12 PM: success building schema โ 0.221
12:25:12 PM: warning The plugin "gatsby-plugin-i18n" used a reserved field name in the context object when creating a page:
12:25:12 PM: * "path"
12:25:12 PM: {
12:25:12 PM: "path": "/en/news/WeCare-WC-Lands-in-Peoples-Square/",
12:25:12 PM: "component": "/opt/build/repo/src/templates/blog-post.js",
12:25:12 PM: "context": {
12:25:12 PM: "path": "/en/news/WeCare-WC-Lands-in-Peoples-Square/",
12:25:12 PM: "slug": "/en/news/WeCare-WC-Lands-in-Peoples-Square/",
12:25:12 PM: "langKey": "en"
12:25:12 PM: },
12:25:12 PM: "layout": "en"
12:25:12 PM: }
12:25:12 PM: Data in "context" is passed to GraphQL as potential arguments when running the
12:25:12 PM: page query.
12:25:12 PM: When arguments for GraphQL are constructed, the context object is combined with
12:25:12 PM: the page object so *both* page object and context data are available as
12:25:12 PM: arguments. So you don't need to add the page "path" to the context as it's
12:25:12 PM: already available in GraphQL. If a context field duplicates a field already
12:25:12 PM: used by the page object, this can break functionality within Gatsby so must be
12:25:12 PM: avoided.
12:25:12 PM: Please choose another name for the conflicting fields.
12:25:12 PM: The following fields are used by the page object and should be avoided.
12:25:12 PM: * "path"
12:25:12 PM: * "matchPath"
12:25:12 PM: * "component"
12:25:12 PM: * "componentChunkName"
12:25:12 PM: * "pluginCreator___NODE"
12:25:12 PM: * "pluginCreatorId"
12:25:12 PM: success createPages โ 0.060
12:25:12 PM: success createPagesStatefully โ 0.078
12:25:12 PM: success onPreExtractQueries โ 0.000
12:25:12 PM: success update schema โ 0.024
12:25:12 PM: success extract queries from components โ 0.214
12:25:12 PM: success write out requires โ 0.004
12:25:12 PM: success write out redirect data โ 0.001
12:25:12 PM: success onPostBootstrap โ 0.000
12:25:12 PM: info bootstrap finished - 3.956 s
12:25:13 PM: success run static queries โ 0.173 โ 4/4 23.25 queries/second
12:25:25 PM: [BABEL] Note: The code generator has deoptimised the styling of /opt/build/repo/node_modules/mapbox-gl/dist/mapbox-gl.js as it exceeds the max of 500KB.
12:26:10 PM: success Building production JavaScript and CSS bundles โ 57.050
12:26:10 PM: success Rewriting compilation hashes โ 0.001
12:26:10 PM: success run page queries โ 0.219 โ 19/19 87.18 queries/second
12:26:17 PM: [BABEL] Note: The code generator has deoptimised the styling of /opt/build/repo/node_modules/react-intl/locale-data/index.js as it exceeds the max of 500KB.
{
"name": "gatsby-starter-default-i18n",
"description": "Gatsby default starter",
"version": "1.0.0",
"author": "angeloocana.com",
"dependencies": {
"bulma": "^0.7.4",
"classnames": "^2.2.6",
"gatsby": "^2.0.102",
"gatsby-link": "^2.0.9",
"gatsby-plugin-i18n": "^1.0.1",
"gatsby-plugin-react-helmet": "^3.0.5",
"gatsby-plugin-sass": "^2.0.11",
"gatsby-source-filesystem": "^2.0.37",
"gatsby-transformer-remark": "^2.3.12",
"intl": "^1.2.5",
"mapbox-gl": "^0.54.0",
"node-sass": "^4.12.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-helmet": "^5.2.0",
"react-intl": "^2.8.0",
"react-router-dom": "^4.3.1"
},
"keywords": [
"gatsby"
],
"license": "MIT",
"main": "n/a",
"scripts": {
"start": "gatsby develop",
"build": "gatsby build",
"develop": "gatsby develop",
"format": "prettier --trailing-comma es5 --no-semi --single-quote --write 'src/**/*.js'",
"test": "jest",
"coverage": "codecov"
},
"devDependencies": {
"codecov": "^3.0.0",
"jest": "^24.0.0",
"prettier": "^1.16.1"
},
"jest": {
"testPathIgnorePatterns": [
"/node_modules/",
"/.cache/"
]
}
}
Same issue here. My site builds eventually but looks terrible. Seems to be styled components not building correctly.
Yeah same issue for me, haven't touched any files since the last deploy
+1 @i-bsd I'm experience build failure after adding styled-components/gatsby-plugin-styled-components
I was having a similar issue with my builds failing out of no where but managed to fix my issues by disabling source maps using this gatsby plugin.
I'm not totally sure why this worked for me.
Build stuck for me locally after adding Gatsby styled components plugin. It was fine without the plugin.
The issued didn't reproduce in the example.
So I went on and investigated the difference.
I have figured out that this was the culprit:
"babel-plugin-styled-components": "^1.10.0",
So to fix the issue I had to do this:
yarn add [email protected]
Looking at its release history I figure that the issue appeared between 1.10.1 and 1.10.4.
Considering this thread started 2 days ago, I suspect 1.10.2 released 6 days ago wasn't the issue.
I confirmed this by installing it and verifying.
1.10.4 was a minor change released in the same day, so not likely the issue.
So after verifying 1.10.3 I confirmed that it is the first version that broke the build.
Here's a list of changes:
https://github.com/styled-components/babel-plugin-styled-components/releases/tag/v1.10.3
- do not try to transpile things we don't own (styled-components/babel-plugin-styled-components#230)
- customize css prop component injection depending on use case (styled-components/babel-plugin-styled-components#228)
- Support custom elements (styled-components/babel-plugin-styled-components#229)
- Support nested + lowercase components (styled-components/babel-plugin-styled-components#229)
- fix ssr transpilation of object styles in the css prop (styled-components/babel-plugin-styled-components#229)
I invite you to further investigation.
Looking at the list of issues I found that gatsby users weren't the only victims:
https://github.com/styled-components/babel-plugin-styled-components/issues/232
Tried a combo of all of these but sadly still stuck. Think we all have a same same but different issue depending on the various packages we have installed.
For me, I disabled react-lazyload and everything works again.
Weird thing is - I've never had a problem using that package until now. I'd love to know what changed in the last gatsby update to cause it to break like this.
I am still having this issue.
I've tried the above fixes adding no sourcemaps and also disabling react-lazyload.
Gatsby build and develop both complete locally. Netlify is stuck.
@rkretch91 @ArthurHwang Have you tried installing a different version of babel-plugin-styled-components?
Looks like it's fixed in [email protected]
I my case I couldn't solve it with Style Components upgrade or leaving out Source Maps. I documented it over here, because for me it is related to MDX https://github.com/ChristopherBiscardi/gatsby-mdx/issues/411
Yes 1.10.6 finally worked for me! Still trying to figure out what happened here, but I am happily deployed again :) Thanks @Vanuan for the fix.
we've done a few fixes on [email protected] so that should work.
If not, please let us know.
Most helpful comment
Looks like it's fixed in [email protected]