BrowserSync: command not found after installing locally

Viewed 1781

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

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!

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.

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.

Related