[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"blog-vercel上的node-canvas部署問題":3},{"id":4,"slug":5,"title":6,"description":7,"content":8,"date":9,"image":10,"imageAlt":6,"author":11,"categories":14,"path":20,"minRead":21},3369,"vercel上的node-canvas部署問題","Vercel上的node-canvas部署問題","Vercel上的node-canvas部署問題 如果要在Vercel上部署有node-canvas的專案，應該 […]","\u003Ch1>Vercel上的node-canvas部署問題\u003C\u002Fh1>\n\u003Cp>如果要在Vercel上部署有node-canvas的專案，應該都會遇到這個問題XD可能會有幾種錯誤訊息，像是\u003Ccode>version &#039;ZLIB_1.2.9&#039; not found\u003C\u002Fcode>或是\u003Ccode>libuuid.so.1: cannot open shared object file:\u003C\u002Fcode>，主因是node-canvas會使用以下幾個函式庫：\u003C\u002Fp>\n\u003Col>\n\u003Cli>libuuid.so\u003C\u002Fli>\n\u003Cli>libmount.so\u003C\u002Fli>\n\u003Cli>libblkid.so\u003Cbr \u002F>\n但Vercel上的serverless環境預設沒有這些函式庫導致部署失敗。\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cp>這邊分享我成功的設定。\u003C\u002Fp>\n\u003Ch2>解決做法\u003C\u002Fh2>\n\u003Cp>關鍵就是package.json上的設定，必須在執行或編譯前，讓Vercel先安裝函式庫。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>  &quot;scripts&quot;: {\n    &quot;now-build&quot;: &quot;yum install libuuid-devel libmount-devel &amp;&amp; cp \u002Flib64\u002F{libuuid,libmount,libblkid}.so.1 node_modules\u002Fcanvas\u002Fbuild\u002FRelease\u002F &amp;&amp; npm run start&quot;\n  },\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>並且我的環境使用的是\u003Ccode>canvas＠2.6.1\u003C\u002Fcode>，有人提到\u003Ccode>canvas＠2.8.0\u003C\u002Fcode>也可以，但我是失敗的，這邊就試試看囉\u003C\u002Fp>\n\u003Cpre>\u003Ccode>&quot;dependencies&quot;: {\n    &quot;canvas&quot;: &quot;2.6.1&quot;,\n  },\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>最後記得Vercel上要將node運作環境改為14。\u003Cbr \u002F>\n真是麻煩的問題，找了整整一天資料才成功部署XD\u003C\u002Fp>\n","2023-02-24T10:30:36","\u002Fapi\u002Fproxy-image?url=https%3A%2F%2Fpost.billxu.net%2Fwp-content%2Fuploads%2F2023%2F01%2F640px-Node.js_logo.svg.png",{"name":12,"link":13},"Chih Fan","http:\u002F\u002Fpost.billxu.net",[15,18],{"name":16,"slug":17},"Devops","devops",{"name":19,"slug":19},"node","\u002Fblog\u002Fvercel上的node-canvas部署問題",1]