harlan-zw / nuxt-seo

The complete SEO solution for Nuxt.
https://nuxtseo.com
934 stars 54 forks source link

Error when adding seo package to Nuxt Application setup on Firebase infrastructure. #252

Open davemg3 opened 3 days ago

davemg3 commented 3 days ago

Describe the bug

Hi, Nuxt Project set up with Firebase as per https://nuxt.com/deploy/firebase and running locally as on Firebase server For reminding, step to deploy on Firebase :

  1. npm run build -- --preset=firebase
  2. cd .output\server
  3. npm install
  4. firebase deploy

Adding nuxt-seo package "@nuxtjs/seo": "^2.0.0-rc.10", and using OgImage locally everything is fine. Tested with nuxt dev tool.

Trying to deploy,

(node:33208) [DEP0166] DeprecationWarning: Use of deprecated double slash resolving ".//index.json" for module request ".//index.json" matched to "./*" in the "exports" field module resolution of the package at C:\Users...\landing-page\app\node_modules\@unocss\preset-wind\package.json imported from C:\Users...\landing-page\app\node_modules\nuxt-seo-experiments\dist\node_modules.

npm ERR! Cannot set properties of null (setting 'peer')

=> Impossible to deploy the project in production using nuxt-seo package.

Is there already a similar bug open? Any clue?

Reproduction

Currently it happens, on my machine at least, with new nuxt projet, one single page and firebase/vite/boostrap + nuxt-seo used together

System / Nuxt Info

 Nuxt 3.11.2 with Nitro 2.9.6                                                                                                                                                                                 
 Using Nitro server preset: firebase                                                                                                                                                                       
 vite v5.2.8 ...
Shell
System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 13th Gen Intel(R) Core(TM) i7-1360P
    Memory: 432.58 MB / 15.69 GB
  Binaries:
    Node: 20.13.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.5.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (125.0.2535.92)
    Internet Explorer: 11.0.22621.3527
davemg3 commented 3 days ago

This error happening when using only Ogimage, i have tried with nuxt-og-image package only and not nuxt-seo package Still an error but with different message and only happening at step 4 "deployment" while still having a lot of warning at step 2.

i functions: updating Node.js 20 (2nd Gen) function server(europe-west1)... Build failed with status: FAILURE and message: npm error code EBADPLATFORM npm error notsup Unsupported platform for @css-inline/css-inline-win32-x64-msvc@0.14.1: wanted {"os":"win32","cpu":"x64"} (current: {"os":"linux","cpu":"x64"}) npm error notsup Valid os: win32 npm error notsup Actual os: linux npm error notsup Valid cpu: x64 npm error notsup Actual cpu: x64

so being aware of following github issue : https://github.com/nuxt/nuxt/issues/26735, https://github.com/nuxt/nuxt/issues/26735 and https://github.com/unjs/nitro/issues/1367 I went to see the package.json created on Nitro server for Firebase. It was as per following : ...

{"name":"nuxt-app-prod","version":"0.0.0","type":"module","private":true,"dependencies":{"@babel/parser":"7.24.7", "@css-inline/css-inline":"0.14.1","@css-inline/css-inline-win32-x64-msvc":"0.14.1", "@jridgewell/sourcemap-codec":"1.4.15","@resvg/resvg-js":"2.6.2", "@resvg/resvg-js-win32-x64- ...

Removing the 2 culprits here manually css-inline and resvg-js-win32 solved the issue and deployment was successful. But unfortunately, in production, the Og image is broken and cannot be displayed (while in local, it works)...

same issue discussed on Reddit : https://www.reddit.com/r/Nuxt/comments/1atxhda/help_ogimage_failure_to_build_on_intel_mac/