VSCODE & GitHub Desktop pre-commit hook: npx: command not found

Question

I am starting a new repo, thinking I should use the most recent Huksy v6 which is installed from LintStaged using their setup guide:

npx mrm lint-staged

// package.json updated with:
"husky": ">=6",
"lint-staged": ">=10",

This adds necessary packages and adds the husky files including the precommit files:

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx lint-staged

When i run my commit in the terminal it works fine. However, if I try to run my commit in GitHub Desktop or VSCode (which I know some teammates do), it results in an error for both:

npx: command not found. husky - pre-commit hook exited with code 127 (error)

I have npx installed:

npx -v
// 6.14.10

If I try to install in globall, such as described in other StackOverflow suggestions, it returns a warning about existing location (with & with out sudo):

ERR! EEXIST: file already exists, symlink '../lib/node_modules/npx/index.js' -> '/Users/plucks/.nvm/versions/node/v14.15.4/bin/npx' npm ERR! File exists: /Users/plucks/.nvm/versions/node/v14.15.4/bin/npx npm ERR! Remove the existing file and try again, or run npm npm ERR! with --force to overwrite files recklessly.

Is there anything I can do so the programs like VSCode & GitHub Desktop can run?

score 74 · Answer 1 · edited Jan 14 '22 at 18:21

74

I've got the solution from here. Hope you can find it as well!

Here it is, for clarity:

add a file ~/.huskyrc if you don't have one already
make sure it includes the following:

# ~/.huskyrc
# This loads nvm.sh and sets the correct PATH before running hook
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

edited Jan 14 '22 at 18:21

gkri

1,627
3
18
27

answered May 11 '21 at 07:44

Misol Goh

813
6
9

Prefer to add this into .husky/pre-commit because you can share it via git – Apache Jun 26 '22 at 11:31

score 18 · Answer 2 · answered Aug 06 '21 at 21:38

18

As per this suggestion, adding the following to your pre-commit file should fix it:

export NVM_DIR="$HOME/.nvm/nvm.sh"
. "$(dirname $NVM_DIR)/nvm.sh"

export NVM_DIR="$HOME/.nvm"
a=$(nvm ls | grep 'node')
b=${a#*(-> }
v=${b%%[)| ]*}

export PATH="$NVM_DIR/versions/node/$v/bin:$PATH"

So the full file would look like this:

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

export NVM_DIR="$HOME/.nvm/nvm.sh"
. "$(dirname $NVM_DIR)/nvm.sh"

export NVM_DIR="$HOME/.nvm"
a=$(nvm ls | grep 'node')
b=${a#*(-> }
v=${b%%[)| ]*}

export PATH="$NVM_DIR/versions/node/$v/bin:$PATH"

npm run test

answered Aug 06 '21 at 21:38

Cathal Mac Donnacha

1,285
1
16
23

2

Thanks for this! I'm running Ubuntu and added that first block of text to ~/.huskyrc and fixed the issue when doing a commit from GitHub Desktop. – Malachi Bazar Apr 26 '22 at 17:46
1

what if you dont use nvm? – Flion Nov 18 '22 at 15:36

score 17 · Answer 3 · answered Sep 07 '22 at 12:27

17

Before adding any modifications to your project try restarting your IDE as mentioned in this issue

answered Sep 07 '22 at 12:27

Mis

171
1
3

2

I highly recommend other people try this first. This worked for me and saved a lot of hassle of not having to write a bunch of bash scripting or custom configuring. – Jeremy Bailey Dec 05 '22 at 22:01
1

Yes restarting fixed it for me as well, it was working fine for me with VS Code and started breaking for me all of a sudden, I tried reloading the window that didn't work out but if you restart the IDE that fixes it. – Alien128 May 30 '23 at 16:54
This worked for me too – Eliezer Steinbock Aug 06 '23 at 12:26

Ershad Qaderi · Answer 4 · 2022-07-06T13:35:31.767

16

For husky>=6: update your .husky/pre-commit file to contain this:

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

npx lint-staged

This will find and expose the current node path and therefore npx path that you are using, which has been configured with Node Version Manager nvm

edited Jul 06 '22 at 13:35

answered Feb 10 '22 at 20:19

Ershad Qaderi

441
4
11

score 7 · Accepted Answer · answered Mar 16 '22 at 09:16

7

I had to combine the answers of Cathal and Misol.

I did not want to edit the .husky/pre-commit like Cathal for two reasons:

I would need to that for every project I use husky in
It would actually break husky for my fellow developers on Windows

So I added a global ~/.huskyrc file like Misol did with the following contents:

export NVM_DIR="$HOME/.nvm/nvm.sh"
. "$(dirname $NVM_DIR)/nvm.sh"

export NVM_DIR="$HOME/.nvm"
a=$(nvm ls | grep 'node')
b=${a#*(-> }
v=${b%%[)| ]*}

export PATH="$NVM_DIR/versions/node/$v/bin:$PATH"

answered Mar 16 '22 at 09:16

Tafel

1,017
10
17

1

Works like a charm, very nice. – Vissie May 30 '22 at 09:46
this is the only solution which worked for both VSCode & Github Desktop for me – Phil Lucks Apr 12 '23 at 18:42

score 1 · Answer 6 · answered Mar 24 '22 at 19:09

If you are working on a team with other people who may have installed nvm or node in slightly different fashion than you have, I would not recommend adding any export statements or edits to the $PATH in your .husky/precommit or ~/.huskyrc files.

If you want your VSCode to have proper access to the $PATH you expect from terminal you should always launch VSCode from terminal in the folder you are working from.

For example, in a terminal window:

~/_git/my_project: code .

Will launch VSCode with my_project open in a new window (it should remember your tabs and window state from the last time you worked on your project).

VSCode will now use the $PATH your terminal uses from your ~/.zshrc or ~/.bashrc, etc.

With this setup my .husky/precommit looks like this:

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx lint-staged

and my my .lintstagedrc.json looks like this:

{
  "*.{js,jsx,ts,tsx}": [
    "eslint --fix --debug --max-warnings=-1",
    "npm run lint:prettier-fix"
  ],
  "*.{css,less,sass,scss}": ["npm run lint:prettier-fix"],
  "*.{g?(raph)ql,json,html,md,y?(a)ml}": ["npm run lint:prettier-fix"]
}

This answer is unhelpful. People aren't going to only ever launch VSCode and Github Desktop via CLI from a project folder. — so001, Aug 21 '22 at 06:00

score 1 · Answer 7 · answered Aug 24 '22 at 14:22

1

For those using fnm instead of nvm, adding the following to ~/.huskyrc worked for me:

eval "$(fnm env)"

answered Aug 24 '22 at 14:22

shuckster

5,279
2
23
22

score 1 · Answer 8 · edited Mar 12 '23 at 09:56

The other suggestions are fine until you have only one node version if you have two node versions and in one of them you don't have the yard installed you will face this issue, so do a simple change

# ~/.huskyrc
# This loads nvm.sh and sets the correct PATH before running hook
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

# This take the current active node version you want to verify the hook
export NVM_DIR="$HOME/.nvm"
a=$(nvm current)

export PATH="$NVM_DIR/versions/node/$a/bin:$PATH"

score 0 · Answer 9 · answered Jul 27 '22 at 07:36

0

Open VSCode settings and set the Inherit Env setting (Terminal > Integrated: Inherit Env) to false:

"terminal.integrated.inheritEnv": false

This setting enables or disables whether new shells should inherit their environment from VS Code.

answered Jul 27 '22 at 07:36

krema

939
7
20

score 0 · Answer 10 · answered Oct 18 '22 at 10:37

I change code as the top answer says. But it doesn't works at first, and then reopen VScode and it works.

In the terminal, I input these commands:

copy this command in terminal and press enter.

vi ~/.huskyrc

copy this command in terminal.

export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

input :wq to quit edit state
reopen VScode.

VSCODE & GitHub Desktop pre-commit hook: npx: command not found

10 Answers10