node-sass dependency

[LiamWinterton]

Somewhere along the line, node-sass is a dep of this project.

I install the seo-pane on a project yesterday at home, and pulling down that repo today at work I couldn't get npm to install deps because of node-gyp and node-sass. Removing seo-pane completely solved my issue.

[voidhrithik]

is this issue resolved. ??

[robertpainsi]

is this issue resolved. ??

Afaikt, no! I tried to install npm i sanity-plugin-seo-pane today and got an error related to node-sass.

npm ERR! path …/node_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js

Then I tried to install node-sass manually first by using npm i node-sass. Installing sanity-plugin-seo-pane now results in a new node-sass error

npm ERR! path …/node_modules/yoastseo/node_modules/node-sass

node version 18.15.0
npm version 9.5.0

[frankspin89]

I can confirm that it's not possible to install this plugin on Windows 11 based system without node-sass

 C:\Program Files\nodejs\node.exe C:\dev\project-next\node_modules\yoastseo\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli   'C:\\Program Files\\nodejs\\node.exe',
npm ERR! gyp verb cli   'C:\\dev\\project-next\\node_modules\\yoastseo\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli   'rebuild',
npm ERR! gyp verb cli   '--verbose',
npm ERR! gyp verb cli   '--libsass_ext=',
npm ERR! gyp verb cli   '--libsass_cflags=',
npm ERR! gyp verb cli   '--libsass_ldflags=',
npm ERR! gyp verb cli   '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@16.15.0 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed     at getNotFoundError (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed     at F (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed     at E (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed  python2 Error: not found: python2
npm ERR! gyp verb `which` failed     at getNotFoundError (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed     at F (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed     at E (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed   code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python
npm ERR! gyp verb `which` failed     at getNotFoundError (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed     at F (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed     at E (C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\yoastseo\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed     at C:\dev\project-next\node_modules\isexe\index.js:42:5
npm ERR! gyp ERR! stack     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp ERR! System Windows_NT 10.0.22621
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\dev\\project-next\\node_modules\\yoastseo\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd C:\dev\project-next\node_modules\yoastseo\node_modules\node-sassnpm ERR! gyp ERR! node -v v16.15.0
npm ERR! gyp ERR! node-gyp -v v3.8.0npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1

npm ERR! A complete log of this run can be found in:

[jonathanselwall]

I am also running into this issue when trying to install the package.

Failed in 408ms at /home/node_modules/.pnpm/node-sass@4.14.1/node_modules/node-sass
 ELIFECYCLE  Command failed with exit code 1.

 
pnpm version: 8.2.0
node version: 18.12.0
 

[Ne-Ne]

Same issue here. Are there any future plans to fix this?

[SimeonGriggs]

The node-sass dependency comes from the yoastseo package that powers the evaluations. Unfortunately we would rely on them removing it to resolve this issue.

[kerns]

The node-sass dependency comes from the yoastseo package that powers the evaluations. Unfortunately we would rely on them removing it to resolve this issue.

Thanks @SimeonGriggs for the update. 🙏 Given the archived status of the project on which this depends, that doesn't seem likely... where does this leave sanity-plugin-seo-pane ? Is it safe to say this project is not longer viable? Are there plans to transition it to something else... like, just supporting the new metadata API in next.js 13, or...idk... interfacing with next-seo.

[SimeonGriggs]

The npm package yoastseo, I believe, is published from this repository:
https://github.com/Yoast/wordpress-seo

This plugin relies entirely on this package to operate, and it's quite open about that in the README (it's the second word 😅 of the first paragraph), so it is then only as functional and up-to-date as that underlying package. The SEO scores and feedback that is shown in the plugin are all evaluations done by that package, so switching it out for another evaluation tool would be to change the plugin completely.

Given there are other API-driven services for SEO analysis, I think it would be more interesting to see unique SEO plugins developed to show feedback from those services.

[lukasentebbe]

Hi. Is der any Update on this? Or any hack? I am getting errors installing the Plugin and no fixes help.
Running on Mac & Node Version 18.
Is there any other option to integrate a SEO check in Sanity?

Thanks!

[CC-Matthias]

This relies on an archived node package called yoastseo. Whatever @SimeonGriggs is saying is wrong because he is linking a PHP package which won't work with npm nor with node and is installed trough composer on wordpress projects. Therefor also this sanity-plugin-seo-pane is dead if they are not updating and removing the dependency.
No way of getting this working

[Meegan1]

@lukasentebbe My current workaround for this issue is to install the latest version of node-sass into my project.

I'm using pnpm, which appears to resolve to the new version automatically, however, this is not the case for npm and requires an additional step to override the peer dependency.

pnpm: pnpm add -D node-sass@latest

npm: npm add -D node-sass@latest + see below

If you are using npm, include the following into your package.json to ensure the peer dependency is resolved to the version now installed in your app:

  "overrides": {
    "sanity-plugin-seo-pane": {
      "node-sass": "$node-sass"
    }
  }

---

For anyone using Next.js, make sure you also add the following to your next.config.js to avoid errors with importing ESM packages:

  experimental: {
    esmExternals: 'loose'
  },
  transpilePackages: [
    "sanity-plugin-seo-pane",
    "lodash-es",
    "yoastseo",
    "@yoast",
  ],

[Jamiewarb]

Whatever @SimeonGriggs is saying is wrong

@CC-Matthias - Simeon is correct. The repo he is linking is a monorepo, and has multiple packages published from it. One of them is this yoastseo package.

This is because the deprecated repo noted above has been moved in to this new repo instead. This means the dependency is not deprecated, just that the original repo is deprecated, as it's been moved. The new-location of the code even had an update 4 days ago, showing it's still active.

However, they have stopped updating the published npm package after this move. This means we can only add the old version of the package as a dependency, as this sanity-plugin-seo-pane plugin does.

This issue is open in the yoastseo repository, where Simeon has asked for them to work on publishing updates to the package again to npm, so that we can update this seo-pane plugin with the newer versions: Yoast/wordpress-seo#17899 (comment)

[Jamiewarb]

@SimeonGriggs Perhaps we could fork and publish it under a temporary name, to allow us to make the updates to the seo-pane? It looks we can use the AbstractResearcher without too many changes to get it initially updated, and then look at supporting the Web Worker approach

[Mminner-FortyAU]

@lukasentebbe My current workaround for this issue is to install the latest version of node-sass into my project.

I'm using pnpm, which appears to resolve to the new version automatically, however, this is not the case for npm and requires an additional step to override the peer dependency.

pnpm: pnpm add -D node-sass@latest

npm: npm add -D node-sass@latest + see below

If you are using npm, include the following into your package.json to ensure the peer dependency is resolved to the version now installed in your app:

  "overrides": {
    "sanity-plugin-seo-pane": {
      "node-sass": "$node-sass"
    }
  }

For anyone using Next.js, make sure you also add the following to your next.config.js to avoid errors with importing ESM packages:

  experimental: {
    esmExternals: 'loose'
  },
  transpilePackages: [
    "sanity-plugin-seo-pane",
    "lodash-es",
    "yoastseo",
    "@yoast",
  ],

This got me through the initial npm install, but now I'm running into some errors popping up within the studio.

Uncaught error: _util2.default.inherits is not a function
http://localhost:3333/node_modules/.sanity/vite/deps/sanity-plugin-seo-pane.js?v=e3472b75:28908:20

Any thoughts on this?

[thexpand]

I can't install it either. Seems to be because of the node-sass package. I am using a MacBook Pro 16" with the M3 Max chip. Node.js version installed is 20.10.0. Initially, I thought it was because I was missing Python (didn't have it installed at first), but then I installed pyenv and tried using both version 2 and version 3 of Python, but it doesn't work.

[robertpainsi]

This got me through the initial npm install, but now I'm running into some errors popping up within the studio.

Uncaught error: _util2.default.inherits is not a function http://localhost:3333/node_modules/.sanity/vite/deps/sanity-plugin-seo-pane.js?v=e3472b75:28908:20

Any thoughts on this?

Got the same error today. Check out compatibility-with-sanity-studio-v3-running-on-vite in the READM. This fixed it for me.

[kulterryan]

I can't install it either. Seems to be because of the node-sass package. I am using a MacBook Pro 16" with the M3 Max chip. Node.js version installed is 20.10.0. Initially, I thought it was because I was missing Python (didn't have it installed at first), but then I installed pyenv and tried using both version 2 and version 3 of Python, but it doesn't work.

I'm facing the same issue