fix: og-image is not accessible in the production environment

[zzy-life]

🐛 The bug

/og-image/image/og.png
500 Abnormal

🛠️ To reproduce

https://www.webarcx.com/__og-image__/image/og.png

🌈 Expected behavior

Can display normally

ℹ️ Additional context

#266 #252 #350

[zzy-life]

0|NuxtAppName | [nuxt] [request error] [unhandled] [500] Cannot find module '@resvg/resvg-js-linux-x64-gnu'
0|NuxtAppName | Require stack:
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/index.js
0|NuxtAppName | [Vue Router warn]: No match found for location with path "/og-image/image/og.png"
0|NuxtAppName | [Vue Router warn]: No match found for location with path "/og-image/image/og.png"
0|NuxtAppName | You have triggered an unhandledRejection, you may have forgotten to catch a Promise rejection:
0|NuxtAppName | Error: Cannot find module '@resvg/resvg-js-linux-x64-gnu'
0|NuxtAppName | Require stack:
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/index.js
0|NuxtAppName | at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1143:15)
0|NuxtAppName | at Module.Hook._require.Module.require (/www/wwwroot/nodejs/node-v20.12.2-linux-x64-glibc-217/lib/node_modules/pm2/node_modules/require-in-the-middle/index.js:81:25)
0|NuxtAppName | at require (node:internal/modules/helpers:179:18)
0|NuxtAppName | at Object. (/www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js:1:3488)
0|NuxtAppName | at Module._compile (node:internal/modules/cjs/loader:1369:14)
0|NuxtAppName | at Object.Module._extensions..js (node:internal/modules/cjs/loader:1427:10)
0|NuxtAppName | at Module.load (node:internal/modules/cjs/loader:1206:32)
0|NuxtAppName | at Function.Module._load (node:internal/modules/cjs/loader:1022:12)
0|NuxtAppName | at Module.require (node:internal/modules/cjs/loader:1231:19)
0|NuxtAppName | at Module.Hook._require.Module.require (/www/wwwroot/nodejs/node-v20.12.2-linux-x64-glibc-217/lib/node_modules/pm2/node_modules/require-in-the-middle/index.js:101:39)
0|NuxtAppName | [nitro] [unhandledRejection] Error: Cannot find module '@resvg/resvg-js-linux-x64-gnu'
0|NuxtAppName | Require stack:
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js
0|NuxtAppName | - /www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/index.js
0|NuxtAppName | at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1143:15)
0|NuxtAppName | at Module.Hook._require.Module.require (/www/wwwroot/nodejs/node-v20.12.2-linux-x64-glibc-217/lib/node_modules/pm2/node_modules/require-in-the-middle/index.js:81:25)
0|NuxtAppName | at require (node:internal/modules/helpers:179:18)
0|NuxtAppName | at Object. (/www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js:1:3488)
0|NuxtAppName | at Module._compile (node:internal/modules/cjs/loader:1369:14)
0|NuxtAppName | at Object.Module._extensions..js (node:internal/modules/cjs/loader:1427:10)
0|NuxtAppName | at Module.load (node:internal/modules/cjs/loader:1206:32)
0|NuxtAppName | at Function.Module._load (node:internal/modules/cjs/loader:1022:12)
0|NuxtAppName | at Module.require (node:internal/modules/cjs/loader:1231:19)
0|NuxtAppName | at Module.Hook._require.Module.require (/www/wwwroot/nodejs/node-v20.12.2-linux-x64-glibc-217/lib/node_modules/pm2/node_modules/require-in-the-middle/index.js:101:39) {
0|NuxtAppName | code: 'MODULE_NOT_FOUND',
0|NuxtAppName | requireStack: [
0|NuxtAppName | '/www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/js-binding.js',
0|NuxtAppName | '/www/wwwroot/nodejs/html/.output/server/node_modules/@resvg/resvg-js/index.js'
0|NuxtAppName | ]
0|NuxtAppName | }

[harlan-zw]

Hi, it's likely that you have built your app in an environment different than you're hosting it. You can get around this be explicitly requiring @resvg/resvg-js-linux-x64-gnu or by deploying in a CI that matches the same environment.

[zzy-life]

Hi, it's likely that you have built your app in an environment different than you're hosting it. You can get around this be explicitly requiring @resvg/resvg-js-linux-x64-gnu or by deploying in a CI that matches the same environment.

Can I specify the environment of @resvg/resvg-js-linux-x64-gnu? For example, can I specify to build the linux-64 version when building on windows?

[harlan-zw]

Seems like this is possible:

• NPM: npm i --cpu x64 --os linux OR npm --target_arch=linux --target_arch=x64
• PNPM: https://pnpm.io/pnpm-cli#differences-vs-npm

Let me know how you go I can update the docs

[zzy-life]

Seems like this is possible:

• NPM: npm i --cpu x64 --os linux OR npm --target_arch=linux --target_arch=x64
• PNPM: https://pnpm.io/pnpm-cli#differences-vs-npm

Let me know how you go I can update the docs

pnpm add @resvg/resvg-js-linux-x64-gnu
It's normal