Ensuring Visual Studio 2015 is using the latest NodeJS and NPM version


When Visual Studio 2015 uses NodeJS and NPM it uses the version local to itself, which as I discovered is annoying if:

  1. You didn’t know this
  2. Thought your PC was up to date after installing the latest NodeJS and NPM globally.

First lets ensure you have installed the latest nodejs and npm globally.

Install / Update NodeJS globally.

  • Using your browser, navigate to https://nodejs.org and download the current version of NodeJs.
  • Once you have downloaded NodeJs, ou can run the installer and work your way through the wizard.
  • Once installed, you can open up a command prompt. Node.js command prompt is also available.

  • Open up the node.js command prompt and type node -v to get the node version. Should match the version you downloaded from the website.

Installing / Update NPM globally.

  • Open the Node.js command prompt
  • Type the following
npm install npm@latest -g
  • Then type npm -v to get the npm version number.

Extensions for Visual Studio 2015

I recommend getting the following extensions for Visual Studio

Click download in both links and install the extensions into Visual Studio.

After you have installed the “NPM Task Runner”, you might need to make it visible in your Visual Studio. To do this, select View > Other Windows > Task Runner Explorer or press Ctrl + Alt + Bkspace



After you have installed the “Package Installer”, when you right click on your project you will see a new link under Add
called Quick Install Package…

When clicked, you can select and install a package from the following package managers


We will use these extensions in a moment.

Checking Visual Studio Version and Updating.

We are going to create a project, and add a package using the Quick Install Package, this will create us a package.json file. We add some commands to the Scripts section, and run them in the task runner.

  • Create yourself a blank web project.
  • Right click
    the project and select Quick Install Package…
  • Select NPM and type TypeScript in the next box, can leave Latest Version and click Install.

  • After you have clicked install you should see a package.json file, which doesn’t have much in it.
{
  "name": "myproject",
  "version": "1.0.0",
  "devDependencies": {
    "typescript": "^2.1.5"
  }
}
  • Update the json file to include two scripts, getNPMVersion, getNodeVersion and updateNPMVersion.
{
  "name": "myproject",
  "version": "1.0.0",
  "devDependencies": {
    "typescript": "^2.1.5"
  },
  "scripts": {
    "getNpmVersion": "npm -v",
    "getNodeVersion": "node -v",
    "updateNPM": "npm install npm@latest"
  }
} 
  • After you have saved the json file, in the Task Runner Explorer window, click the refresh button. You should see your three scripts available to you.

  • Right click on getNpmVersion
    and click Run. The result will display in the Task Runner Explorer console window. You will note that this version is different to the version number you got at the start of this blog post through the Node.js command prompt window.
  • To Update NPM, right click on updateNPM and click Run. After it has completed, run getNpmVersion again. You should find that the version now matches the version you got earlier.
  • Right click on getNodeVersion and click Run. My version is v5.4.1
  • There doesn’t seem to be a command to update the Nodejs in visual studio. However, we can make it use the global version of Nodejs.
  • In Visual Studio click on Tools > Options. Inside Options, select Projects and Solutions > External Web Tools.
  • Add the NodeJS path. Mine is “C:\Program Files\nodejs”. Then move this to the top.

  • Go back to the Task Runner and run the command getNodeVersion you should now see the version matches the version you got earlier in the Node.js command window.

You should now be up to date.