"Segmentation fault" on Vercel (when using Plaiceholder/Sharp)

[joe-bell]

What version of Next.js are you using?

10.1.1

What version of Node.js are you using?

14.16.0

What browser are you using?

N/A

What operating system are you using?

macOS

How are you deploying your application?

Vercel

Describe the Bug

When using Plaiceholder (or Sharp-based) inside getStaticProps, the build succeeds locally, but fails on Vercel with the following error:

11:58:56.697  	info  - Finalizing page optimization...
11:59:03.575  	sh: line 1:   761 Segmentation fault      (core dumped) next build
11:59:03.585  	npm ERR! code ELIFECYCLE
11:59:03.585  	npm ERR! errno 139
11:59:03.593  	npm ERR! issue-repro-nextjs-plaiceholder@0.0.1 build: `npm run pre-build && next build`
11:59:03.593  	npm ERR! Exit status 139
11:59:03.594  	npm ERR! 
11:59:03.594  	npm ERR! Failed at the issue-repro-nextjs-plaiceholder@0.0.1 build script.

Expected Behavior

Although Sharp has been removed from the Next.js dependencies, I would expect to be able to install it manually and use within getStaticProps

To Reproduce

Reproduction Project

GitHub: https://github.com/joe-bell/issue-repro-nextjs-plaiceholder
Vercel: https://vercel.com/joebell/issue-repro-nextjs-plaiceholder

To help debug this I've showcased 4 different strategies to create placeholders:

1. Base64 strings created in a pre-build step via ts-node
2. CSS created in a pre-build step via ts-node
3. Base64 strings created in getStaticProps
4. CSS created in getStaticProps

All strategies run successfully locally

Pre-build strategies run successfully on Vercel, but getStaticProps do not.

Running Locally

To build locally, run npm run build

Related Issues / Discussions

https://github.com/joe-bell/plaiceholder/issues/60

#23189
#20915 (comment)

Additional Context

Previously contacted Vercel support via @mcsdevv, but I understand it would be more helpful to provide a more detailed repoduction

[joe-bell]

Just tested with next@10.1.3-canary.0, unfortunately the same issue persists:

• Source: https://github.com/joe-bell/issue-repro-nextjs-plaiceholder
• Deployment: https://vercel.com/joebell/issue-repro-nextjs-plaiceholder/FqcAaktC7Y6fiq9UrKV2YmX19hPL

[aguilarm]

I had a similar issue building via Docker when next/image elements are included in static files, when using next past version 10.0.5 and Dockerfiles based on node:12 and node:14.

Using the newest version of Docker node:alpine-current successfully compiles, but interestingly the node:current-buster Debian version fails. Perhaps related to but not exactly this: lovell/sharp#2048.

Likely either vercel is using one of these Docker images or missing the same thing the images are. Not 100% certain exactly what that is - according to this nodejs/docker-node#1158 it looks security config related?

Edit: Re-reading and realizing Next removed Sharp, it seems like my segfault is not likely to be 100% related to yours. I am using sharp in some API routes, but those aren't being called on build. Odd.

[elrumordelaluz]

I found that deploying on Vercel today fails due to an api route which uses sharp, but yesterday do not. Already asked to the support if there is a known issue.

[divmain]

Hey! I took a look at your repro (thank you for including that!) and this issue actually does consistently reproduce when running next build in a Linux environment - so, firstly, we know this is not Vercel-specific.

Best guess is that this is an issue with a recent release of sharp. How I got there:

• find node_modules -iname "*.node" shows only node_modules/sharp/build/Release/sharp.node. This tells us the segfault is occurring either in Node.js internals or in sharp.
• gdb gives us a little more information:
  • in the terminal, run gdb --args node ./node_modules/.bin/next build
  • at the prompt, enter run
  • let the build progress, and you'll be provided the following stack trace:

#0  0x00007fffdd8844db in ?? ()
#1  0x00007ffff7c49481 in __nptl_deallocate_tsd () at pthread_create.c:302
#2  0x00007ffff7c4a5b1 in __nptl_deallocate_tsd () at pthread_create.c:257
#3  start_thread (arg=0x7fffdebfc640) at pthread_create.c:474
#4  0x00007ffff7b70223 in clone () at ../sysdeps/unix/sysv/linux/x86_64/clone.S:95

__nptl_deallocate_tsd is a cleanup routine that's executed when a thread exits; so the segfault appears to occur when a thread has exited and thread-local memory has not been cleaned up correctly. Sharp relies on libvips for image processing, which is what relies on pthreads for concurrency.

I'm going to close this issue for now, but please re-open if there's reason to believe this is caused by Next.

[joe-bell]

Hey @divmain, thanks for digging into this and giving a detailed response!

This kind of stuff is out of my area of expertise to be honest, so I've flagged up the issue with sharp directly to investigate further. If it is something on the Next.js side, I'll re-open

[joe-bell]

Update 🎉

@​lovell offered a fix

// next.config.js
require('sharp');
module.exports = {};

However, is this the recommended approach for adding sharp to the main thread @divmain?

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.