WebStorm does not recognize volta's npm and yarn commands

[amcsi]

I tried to get WebStorm (or rather, PhpStorm, but probably WebStorm is the same) to use the npm and yarn commands in ~/.volta/bin, but they are not recognized. node itself is recognized though.

[Ore4444]

right. webstorm can't follow symlinks. having the same issue

[amcsi]

That isn't quite the problem, because node is also a symlink there, but is recognized.

[eitland]

Possibly related about nvm: https://intellij-support.jetbrains.com/hc/en-us/community/posts/205964744-npm-is-installed-using-nvm-but-IntelliJ-doesn-t-know-about-it

[eitland]

Finally found Webstorms tracking issue: https://youtrack.jetbrains.com/issue/WEB-44867

[charlespierce]

Interesting, looking at the issue and what you're saying about node working, but npm and yarn not working, my guess is that WebStorm / PhpStorm / IDEA are internally calling something like this:

/path/to/node /path/to/npm

Which then fails to run because it's expecting npm to be a JS file, and the npm that Volta provides on the PATH is a binary. That would align with the comments in the issue about needing to point at the package, not at the binary.

@amcsi In that issue, you commented that nvm points to a shell script, while Volta points at a JS file. Can you explain how you determined that? Running volta which npm for me shows the path to the same shell script (.../bin/npm), not the path to the JS file. Is it possible that those are reversed, and nvm is actually showing the JS file (which would then work correctly with the above command passing it to Node)?

IDE Support is definitely something we'd like to improve on, so figuring out a way to "reveal" the underlying system for use cases like this (beyond what we currently do with volta which) would likely help for more than just the IntelliJ IDEs.

[amcsi]

@charlespierce the more underlying npm commands can be found in ~/.volta/tools/image/node/<nodeVersion>/<npmVersion>/bin/npm.

[charlespierce]

@amcsi Can you clarify a bit? That's the output of volta which npm, but in the linked WebStorm issue, you said that Volta is pointing to npm-cli.js, which is a sibling file to the npm shell script, but I don't believe we directly reference that anywhere.

[amcsi]

@charlespierce that that path is a symlink to the npm js:

attila-Predator :: /var/www/lycee-overture ‹master› % ls -al ~/.volta/tools/image/node/11.3.0/6.4.1/bin/npm                                                                                                                            
lrwxrwxrwx 1 attila attila 38 szept  3  2019 /home/attila/.volta/tools/image/node/11.3.0/6.4.1/bin/npm -> ../lib/node_modules/npm/bin/npm-cli.js

I probably miscommunicated. I didn't mean to say that ~/.volta/bin/npm directly linked to to the tools folder; it's pointing to the shim. I was just trying to take it one step at a time and try to see how Webstorm deals with trying to load npm with what the shim (can) point to.

Do these make sense?

[charlespierce]

Aha, I missed that, thanks! That entire directory (inside of tools/image/node/<node version>/<npm version>/) is the contents of the npm tarball, directly from nodejs.org.

What's interesting is that if WebStorm is running node /path/to/npm to execute npm, it should work using that symlink, because it links to the JS file. On the other hand, if it's executing the command directly, then using the Volta shim binaries in ~/.volta/bin should work. The fact that it doesn't work with either case is extra confusing.

[amcsi]

@charlespierce I checked, and what I was able to get Webstorm to recognize was: ./volta/tools/image/node/<node version>/<npm version>/lib/node_modules/npm.

So it could really just be that Webstorm doesn't recognize the js npm executables as npm. I even tried loading nvm's <versionFolder>/bin/npm, and Webstorm didn't recognize that.

This is already great news, because this means that I can manually use individual versions of volta's npm in Webstorm.

Perhaps the shim itself (so just ~/.volta/bin/npm is not working, because under the hood it's pointing to the js npm executable in node's bin/npm rather than node's lib/node_modules/npm/bin/npm.

[es50678]

@amcsi @charlespierce

I was also able to get webstorm to recognize ./volta/tools/image/node/<node version>/<npm version>/lib/node_modules/npm as the npm executable. This is great! I prefer volta and can now use it without anymore trouble with my favorite IDE. Thanks for this :)

EDIT:

Some more great news:

doing ./volta/tools/image/yarn/<yarn version> also allows webstorm to recognize the yarn executable :D

[charlespierce]

Note: The Node image directory has changed slightly since this issue was opened. The npm directory can now be found at:

~/.volta/tools/image/node/<node version>/lib/node_modules/npm (Linux & MacOS) %LOCALAPPDATA%\Volta\tools\image\node\<node_version>\node_modules\npm (Windows)

[a-barbieri]

Another workaround is to add volta's yarn/npm bin to the PATH env variable:

Let's say you want to use Yarn. First check the current version of Yarn in your Volta directory:

ls $VOLTA_HOME/tools/image/yarn

Then you can target the Yarn directory with the version you want to use adding it to the PATH env variable. In my case 1.22.10.

export PATH="$VOLTA_HOME/tools/image/yarn/1.22.10/bin:$PATH"

This workaround has one advantage - IDEA will pick up the npm/yarn executable automatically for every project.

See https://youtrack.jetbrains.com/issue/WEB-44867#focus=Comments-27-4884706.0-0

[shaungrady]

It's not exactly a practical fix when you're juggling projects with different npm/node versions.

[a-barbieri]

Yes, I agree. I've posted it as it was recently added to the JetBrains thread, but I didn't use it as well. Honestly I'm still looking for a proper solution.

[ant1eicher]

~/.volta/tools/image/node/14.16.0/lib/node_modules/npm worked for me today ✅

[StormPooper]

I'd also like to see a proper fix for this as you have to juggle this for each project and for each machine (can't sync run configs due to the path being machine-specific).

[charlespierce]

For those struggling with this issue, does anyone know if it's possible to configure WebStorm to run a command to locate the npm folder? We don't currently have anything, but since WebStorm appears to be looking for the npm package folder, rather than the executable itself, we should be able to create something akin to volta which that will resolve the appropriate version and locate the package folder directly for you.

That would require WebStorm supporting a script (something like $(volta locate-npm-package)) in it's configuration, which it would then need to execute each time in order to determine the package manager. If WebStorm supports that, then adding that to Volta should be a straightforward task.

[StormPooper]

I don't think you can use a command within WebStorm, but I did just manage to get jetbrains-npm working with volta by doing the following on my Mac:

1. brew tap nodenv/nodenv
2. brew install jetbrains-npm --ignore-dependencies (to avoid it installing nodenv, autoconf and node-build)
3. Set Package Manager path to the output of brew --prefix jetbrains-npm, which is my case was /usr/local/opt/jetbrains-npm
4. Set my run configurations back to Project to inherit from settings

This appears to work because it falls back to the npm in PATH, which volta is obviously managing. WebStorm doesn't report the version of npm in the UI as it would with the manual path, but running a script that just does npm version does indeed print the correct npm version.

[StormPooper]

Minor updates from experimenting on my Windows machine:

• Cloning the repo into <shimdir>\node_modules\npm works
  • Webstorm picks up npm automatically, so an improvement over the brew installation on the Mac
  • Webstorm reads the version as 1.0.0 from the clone repo's package.json, but it correctly uses the active volta version (worth noting that for Node it reads volta's default node version, so incorrect version numbers is already a thing)
  • It doesn't appear to have an impact on npm commands outside of Webstorm from my brief testing
• I tried the npm installation method first, but the path contains the node version, so it's pointless (obvious but worth checking)

[charlespierce]

I wonder if it would be possible to create a simple WebStorm / JetBrains plugin that knows about Volta's model and works differently from the default behavior for locating npm / yarn, that might allow us to sidestep the specific "package" behavior that WebStorm is using.

[vitalybe]

https://github.com/volta-cli/volta/issues/729#issuecomment-846947786

A slight improvement to @a-barbieri idea is to use the version dynamically from the current version:

export PATH="$VOLTA_HOME/tools/image/yarn/$(yarn --version)/bin:$PATH"

[es50678]

@vitalybe this is awesome! thank you so much!

[matmurdock05]

@vitalybe @a-barbieri thank you both so much!

[2218675712]

Is the problem solved? I ran into this problem too

[FerhatPflegia]

Having the same issues. Is there any progress or news?

[2218675712]

My current solution is to manually set the node path to C:\Program Files\Volta Set the path of npm to C:\Users\Administrator\AppData\Local\Volta\tools\image\node\your version\node_modules\npm

[cgrabmann]

@charlespierce Would it be possible to do something similar to this: https://github.com/nullivex/nodist#make-it-work-in-your-ide

It seems like nodist just has its own npm-cli.js, which just calls their npm shim.

I tried their solution and IntelliJ recognized it as a working npm version. The only problem with Nodist for me was, that it for some reason still used an old npm version after I updated to a new node version and the npm command failed because it was using an incompatible node version.

I did not play around with it that much, since I want to use Volta because it is cross-platform.

[cgrabmann]

Ok I played around with the solution that Nodist is using and adapted it for Volta.

If there is a npm-cli.js file. you can select it and IntelliJ will use it for npm operations, therefore using whatever version is configured by Volta.

If there is a folder structure like:

volta-bin
    ↳ node_modules
        ↳ npm
            ↳ bin

containing the npm-cli.js file then IntelliJ will automatically detect a npm version.
Interestingly it will detect the npm version that the current Volta configuration is pointing to and then configure itself to use that one directly, wherever Volta installed it. This would of course defeat the purpose of using Volta in the first place.

But I guess providing the npm-cli.js file and a similar file for yarn would work as a good workaround until Jetbrains works on the opened Ticket.

[StormPooper]

I've been using jetbrains-npm successfully, which takes the same approach, but dynamically selects the path. From my previous answer:

• Cloning the repo into <shimdir>\node_modules\npm works
  • Webstorm picks up npm automatically, so an improvement over the brew installation on the Mac
  • Webstorm reads the version as 1.0.0 from the clone repo's package.json, but it correctly uses the active volta version (worth noting that for Node it reads volta's default node version, so incorrect version numbers is already a thing)

If Volta included a similar npm-cli.js in the same location, I believe it would solve the issue.

[mbinic]

I found that dropping this npm-cli.js inside C:\Program Files\Volta\bin and setting WebStorm's "Package manager" value to C:\Program Files\Volta lets me start the app successfully from WS.

I have node 16/npm 8 as the default, and the project's pinned versions are node 14/npm 6. Running npm --version from my npm-cli.js above prints out the correct npm version (i.e. v6 pinned in the project) before running the passed command.

Disclaimer: I've just started using WebStorm and thus am not aware of all of the features depending on this and ways it calls npm.

[eitland]

Two things:

• Jetbrains are now working on the issue that I linked above (https://youtrack.jetbrains.com/issue/WEB-44867) from their end. I guess this will be permanently fixed this or next release
• Meanwhile, has anyone managed to get @mbinic s solution working under WSL 2/Windows?

[mbinic]

@eitland, I'm using it on Windows with the latest Rider. Didn't have time to try the EAP yet, nor test the gist with WSL I'm afraid...

[a-barbieri]

And finally JetBrains is supporting Volta natively https://www.jetbrains.com/webstorm/whatsnew/#support-for-volta 🍾

[chriskrycho]

I had totally missed this – looks like we can close it out, since Volta got natively support from JetBrains IDEs a full year and a half ago! 🎉