Closed brunos3d closed 2 years ago
Thank you so much @BrunoS3D, this will be so helpful. I also will add this to the README.
To solve the issue with last version of Vercel and canvas:
in package.json
"scripts": {
"build": "./setup.sh && next build"
}
and create setup.sh
yum install wget
wget https://github.com/NixOS/patchelf/archive/refs/tags/0.17.0.tar.gz
tar -xf 0.17.0.tar.gz
cd patchelf-0.17.0
./bootstrap.sh
./configure
make
make install
cd ..
wget https://zlib.net/fossils/zlib-1.2.9.tar.gz
tar -xf zlib-1.2.9.tar.gz
cd zlib-1.2.9
sh configure
make
cp libz.so.1.2.9 ../node_modules/canvas/build/Release/libz.so.X
cd ..
patchelf --replace-needed /lib64/libz.so.1 libz.so.X ./node_modules/canvas/build/Release/libpng16.so.16
patchelf --replace-needed libz.so.1 libz.so.X ./node_modules/canvas/build/Release/libpng16.so.16
@rlods I tried your solution but the deployment still fails with following error.
/bin/sh: ./setup.sh: Permission denied
Can you please help me solve it?
@rlods I tried your solution but the deployment still fails with following error.
/bin/sh: ./setup.sh: Permission denied
Can you please help me solve it?
https://askubuntu.com/questions/409025/permission-denied-when-running-sh-scripts
To solve the issue with last version of Vercel and canvas:
in
package.json
"scripts": { "build": "./setup.sh && next build" }
and create
setup.sh
yum install wget wget https://github.com/NixOS/patchelf/archive/refs/tags/0.17.0.tar.gz tar -xf 0.17.0.tar.gz cd patchelf-0.17.0 ./bootstrap.sh ./configure make make install cd .. wget https://zlib.net/fossils/zlib-1.2.9.tar.gz tar -xf zlib-1.2.9.tar.gz cd zlib-1.2.9 sh configure make cp libz.so.1.2.9 ../node_modules/canvas/build/Release/libz.so.X cd .. patchelf --replace-needed /lib64/libz.so.1 libz.so.X ./node_modules/canvas/build/Release/libpng16.so.16 patchelf --replace-needed libz.so.1 libz.so.X ./node_modules/canvas/build/Release/libpng16.so.16
I tried this solution but get a no space left on device, write
error.
Thanks @rlods it fixed build for me.
Had problem with fabric
missing ZLIB
This is an issue report for solving common issues.
I created an example project to demonstrate the use of the hook for projects deployed in Vercel.
https://github.com/BrunoS3D/use-next-blurhash-hook-example https://use-next-blurhash.vercel.app/
You have possibly run into this error when implementing the hook
You can solve it by simply adding this code snippet to your
next.config.js
file as shown hereif ( process.env.LD_LIBRARY_PATH == null || !process.env.LD_LIBRARY_PATH.includes( `${process.env.PWD}/node_modules/canvas/build/Release:`, ) ) { process.env.LD_LIBRARY_PATH = `${ process.env.PWD }/node_modules/canvas/build/Release:${process.env.LD_LIBRARY_PATH || ''}`; }
Ref to original solution Automattic/node-canvas#1779 (comment)
Another similar error that doesn't show as many details can also be solved using the solution above:
NOTE: @ivansevillaa, if possible, leave this issue fixed for other people to find a solution for similar issues
But I am not sure which path will come here process.env.LD_LIBRARY_PATH and process.env.PWD
This is (temporary) fixed for mine. (https://www.reddit.com/r/nextjs/comments/13hahc1/having_difficulties_in_deploying_a_nextjs_app)
I opted into using
<Script
src="/assets/fabric.min.js"
onError={(e) => console.error('Error loading fabric.js', e)}
onReady={() => setIsReady(true)}
/>
and I got the minified JS file from http://fabricjs.com/build/ and removed NPM dependency all together.
Component is call as
const Canvas = dynamic(
() => import('./Canvas').then((a) => a.Canvas),
{ ssr: false }
)
@rlods I tried your solution but the deployment still fails with following error.
/bin/sh: ./setup.sh: Permission denied
Can you please help me solve it?
Try this chmod u+r+x setup.sh && ./setup.sh && next build
In my case I got the issue because I upgraded node from 18.16.x to 20.10.x but didn't change the node version in my vercel project settings.
Changing the version there and trigger a deploy fixed the issue.
@yafkari works like a charm. Thank you!
Change Node version to 20x on Vercel soled this issue for me.
Change Node version to 20x on Vercel soled this issue for me.
This worked for me. Thank you!
I tried every possible solution here and I still have the same issue:
⨯ Error: /lib64/libz.so.1: version
ZLIB_1.2.9' not found (required by /var/task/node_modules/canvas/build/Release/libpng16.so.16)`
https://github.com/Automattic/node-canvas/issues/1779#issuecomment-2027970343
This worked for me
{ "next": "13.5.6" "fabric": "^5.3.0" }
I just updated the Node.js Version from 18.x to 20.x, and redeployed. That did it for me.
After testing all the combinations on Vercel, this is finally something that is working for me - no dep on nextjs, but using @vercel/node
directly:
{
"canvas": "2.11.2"
}
16.x
to 20.x
LD_LIBRARY_PATH
env variable from the settings on Vercel (If I don't remove this one, the node: /var/task/node_modules/canvas/build/Release/libstdc++.so.6: version GLIBCXX_3.4.26' not found (required by node)
error would show up)Please give it a try if you also have the same issue on Vercel!
This is an issue report for solving common issues.
I created an example project to demonstrate the use of the hook for projects deployed in Vercel.
https://github.com/BrunoS3D/use-next-blurhash-hook-example https://use-next-blurhash.vercel.app/
You have possibly run into this error when implementing the hook
You can solve it by simply adding this code snippet to your
next.config.js
file as shown hereRef to original solution https://github.com/Automattic/node-canvas/issues/1779#issuecomment-895885846
Another similar error that doesn't show as many details can also be solved using the solution above:
NOTE: @ivansevillaa, if possible, leave this issue fixed for other people to find a solution for similar issues