407

I want to update my Browser-sync without updating all my node packages. How can I achieve this? My current version of Browser-sync does not have the Browser-sync GUI :(

├─┬ browser-sync@1.9.2
│ ├── browser-sync-client@1.0.2
Samuel
  • 5,529
  • 5
  • 25
  • 39
  • 13
    `npm install browser-sync@latest` maybe. should over-write it with the latest (presumably fixing any brokenness?) – rlemon Mar 30 '17 at 20:45

5 Answers5

587

Most of the time you can just npm update (or pnpm update or yarn upgrade) a module to get the latest non breaking changes (respecting the semver specified in your package.json) (<-- read that last part again).

npm update browser-sync
-------
pnpm update browser-sync
-------
yarn upgrade browser-sync
  • Use [p]npm|yarn outdated to see which modules have newer versions
  • Use [p]npm update|yarn upgrade (without a package name) to update all modules

Major version upgrades:

In your case, it looks like you want the next major version (v2.x.x), which is likely to have breaking changes and you will need to update your app to accommodate those changes. You can install/save the latest 2.x.x by doing:

npm install browser-sync@2 --save-dev
-------
pnpm add browser-sync@2 --save-dev
-------
yarn add browser-sync@2 --dev

...or the latest 2.1.x by doing:

npm install browser-sync@2.1 --save-dev
-------
pnpm add browser-sync@2.1 --save-dev
-------
yarn add browser-sync@2.1 --dev

...or the latest and greatest by doing:

npm install browser-sync@latest --save-dev
-------
pnpm add browser-sync@latest --save-dev
-------
yarn add browser-sync@latest --dev

Note: the last one is no different than doing uninstall followed by install like this:

npm uninstall browser-sync --save-dev
npm install browser-sync --save-dev
-------
pnpm remove browser-sync --save-dev
pnpm add browser-sync --save-dev
-------
yarn remove browser-sync --dev
yarn add browser-sync --dev

The --save-dev part is important. This will uninstall it, remove the value from your package.json, and then reinstall the latest version and save the new value to your package.json.

Ryan Wheale
  • 26,022
  • 8
  • 76
  • 96
  • 3
    `npm update browser-sync --save-dev` would also work to update to the major version, and save the package-lock.json (if it exists, of course). – Wildhoney Aug 22 '17 at 14:48
  • 9
    @Wildhoney - I am respectfully disagreeing with you (mostly) - `npm update` will install the latest **respective of semver**. The only way to update to the next _major_ version is to do it explicitly as I describe above. If you have never installed a package and you try to update/save it, then it will install the latest version, but that's not very common. There is also the seldom used semver for specifying _latest major version_ - it would look like this in your package.json: `browser-sync: '*'` OR `browser-sync: 'x'` - but I DO NOT recommend doing that. – Ryan Wheale Aug 22 '17 at 16:53
  • 4
    @RyanWheale, take notice that since npm@5.0.0 `--save-dev` is not needed, because it will get saved to package.json automatically (https://docs.npmjs.com/cli/update) – Evgenia Karunus Sep 16 '18 at 18:26
  • 2
    @lakesare actually as of npm@5.0.0 the default is --save, not --save-dev. You still need to specify --save-dev if you want to create a dev only dependency. – Joshua Harris Oct 15 '18 at 15:55
  • 2
    @JoshuaHarris - using npm@5, `npm update` will update both dependencies and devDependencies and save the new version number to the appropriate locations in package.json. – Ryan Wheale Oct 16 '18 at 00:54
  • 2
    npm update did't worked for me npm install @latest -S worked for me – Learner Jan 10 '20 at 09:59
72

Use npm outdated to see Current and Latest version of all packages.


Then npm i packageName@versionNumber to install specific version : example npm i browser-sync@2.1.0.

Or npm i packageName@latest to install latest version : example npm i browser-sync@latest.

Qui-Gon Jinn
  • 3,722
  • 3
  • 25
  • 32
  • 5
    This answers the op's question more clearly by showing how to install a specific version of a dependency without mentioning major/minor versions. – NightTom Nov 25 '20 at 15:58
  • Might be worth noting that if you do use this command your package json will probably get something like: "@packageName": "^1.26.3". If you want a specific version change the ^ to a ~ like so "@packageName":"~1.26.3" – Daniel Hollinrake Aug 17 '21 at 13:48
  • getting below dependabot alerts, how to fix, tried deleting package-lock.json and in package.json all package has caret ^. 1) ansi-regex vulnerability found in package-lock.json, 2) nth-check vulnerability found in package-lock.json, 3) Vulnerable versions: <= 0.0.7 Patched version: No fix This affects all versions of package ansi-html. If an attacker provides a malicious string, it will get stuck processing the input for an extremely long time. – Girish Sep 29 '21 at 10:10
4

NPM

Update Specific Package to the Latest Version:

npm update browser-sync

Update a Package By Version:

npm view browser-sync versions (view package version)

npm install browser-sync@2

Update all packages to the latest versions:

npm outdated (this checks the registry to see if any installed packages are currently outdated)

npm update --save/--save-dev (updates and saves dependencies in package.json)

Run a security audit for all the packages:

npm audit (submits a description of the dependencies configured in your project to your default registry and asks for a report of known vulnerabilities) npm audit fix (fix vulnerabilities)

Yarn

Updates all packages to the latest version:

yarn upgrade

Updates specific package to the latest version:

yarn upgrade browser-sync

Updates specific package to specific version:

yarn upgrade browser-sync@^2

Pnpm

Updates all dependencies, adhering to ranges specified in package.json:

pnpm up (alias of pnpm update)

Updates all dependencies, ignoring ranges specified in package.json:

pnpm up --latest

Updates browser-sync to the latest version on v2:

pnpm up browser-sync@2

Updates all dependencies under the @babel scope:

pnpm up "@babel/*"

Stas Sorokin
  • 3,029
  • 26
  • 18
0

The legacy-peer-deps command can be helpful as well, especially if you're dealing with some dependency issues and whatnot.

Example: If the package is ngx-multi-window and it's on version 0.3.1

You would run: npm install ngx-multi-window@0.3.2 --legacy-peer-deps

Dan
  • 139
  • 1
  • 6
-1

This worked for me.

uninstall and install the latest version of nodemon

npm uninstall nodemon
npm install nodemon@3.0.1 --save-dev;
Tyler2P
  • 2,324
  • 26
  • 22
  • 31