4

I ran the following command for my node app:

$ npm install browser-sync --save-dev 

Installation was successful, browser-sync appears in my package.json file as well as my node_modules directory.

However, when I run $ browser-sync --version to check that it's working, I get the following error:

bash: browser-sync: command not found

Why isn't this working?

Note: this question is similar, but I don't want to have to install it globally as in this question.

Any help would be greatly appreciated!

3 Answers 3

11

This is because you're trying to use a module locally which is normally installed globally. Modules installed globally end up on your PATH environment variable, which is why you can run them from the terminal as you're trying to do:

$ browser-sync --version 

If you want to use the browser-sync module from a local install you will have to prepend the full path to the browser-sync binary from within your .bin directory since all locally installed modules are placed within your current working directory node_modules directory. i.e. Node modules go in ./node_modules, executables go in ./node_modules/.bin/. So in order to run the browser-sync binary from a local install do the following:

./node_modules/.bin/browser-sync --version 

Hopefully that helps!

Sign up to request clarification or add additional context in comments.

1 Comment

Thank you, this helped me resolve my issue. Running "./node_modules/.bin/browser-sync --version" from the project folder was the fix.
1

If you installed browser-sync using npm --save or npm --save-dev you can run it by writing a script in your package.json. Here's an example of a script I added:

{ ... "scripts": { "dev-server": "browser-sync start --server 'public' --files 'public'" }, ... } 

You can run the scripts from you project's root directory like so

npm run dev-server 

This will run whatever command is set to dev-server in your script. In this case it will run browser-sync for the app/site in a folder called /public and watch for any file changes in the /public folder. I know this question is a bit old but it was unanswered and hopefully I can save someone time in the future.

2 Comments

This worked for me! The answers for this question are really disjointed, so I'm glad this worked. The only thing to mention is that I created a folder called public and put the index.html and css folder in there. I don't know if this works without that, but otherwise it worked great.
And just to be even more specific, I only put the index.html file in the public folder, because I had another watch/build runner and it didn't like that I put the CSS folder in the public folder.
1

The other answers still work, but a newer approach has emerged since npm added the npx command: npx <package-name>.

This command allows you to run an arbitrary command from an npm package (either one installed locally, or fetched remotely), in a similar context as running it via npm run.

Source: https://docs.npmjs.com/cli/v8/commands/npx

In this case, you would run npx browser-sync.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.