Tag Archives: dev environment

How to use Visual Studio 2015 with latest nodejs npm

Problem – Visual Studio uses an old version of npm

When running “npm install” using npm version 2 (npm2) the node_modules dependency graph can (will) cause the path/file tree to grow beyond the path length allowed in Windows.
One example of error messages that can hit you in VS is from the RazorGenerator.MSBuild “Illegal characters in path.”
I found that updating this from 2.2.6 to the latest 2.4.3 solved the particular problem in one project but lead to other problems in another project where other nuget packages needed to be updated due to the update of RazorGenerator.MSBuild

Solution – install the latest version of npm and make Visual Studio use it

node version 3 (npm3) has solved the problem with deep paths, https://docs.npmjs.com/how-npm-works/npm3, and therefore the simplest solution is to use this version in VS, I do not know why VS has not updated to this version but since it is a Windows developer tool aiming hard on the open source arena I am stumbled on why an important “fix” like this is not packaged in an update already.

How to

Install nodejs for windows

Using the latest installer from here https://nodejs.org/en/download/, it is as simple as point and click 🙂

Upgrade npm to latest version

At the time of writing the nodejs installer uses an older npm version and that´s why you should update npm by using “npm-windows-upgrade” (more information can be found here https://www.npmjs.com/package/npm-windows-upgrade)

The short install instruction is
Start powershell as administrator
Run the command “Get-ExecutionPolicy” – to see what your base line setting is (probably Restricted)
Run the command “Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force” – to allow the upgrade
Run the command “npm install –global –production npm-windows-upgrade” to install the upgrader
Run the command “npm-windows-upgrade” to upgrade
and select the latest version by just hitting enter.

npm-windows-upgrade

And optionally run the command “Set-ExecutionPolicy Restricted -Scope CurrentUser -Force” – to set the policy back to the former setting, using the value from the first “Get-ExecutionPolicy” (probably Restricted).

Point Visual Studio to the latest npm version

Add the nodejs path to Visual Studio to use the latest npm (thanks to mr James for pointing it out, http://jameschambers.com/2015/09/upgrading-npm-in-visual-studio-2015/)

In Visual Studio quick search find “External Web Tools”
and Add a new tools location path where the path points to the nodejs folder from the first step, “C:\Program Files\nodejs” or “C:\Program Files (x86)\nodejs” unless you made any changes, and move the location to the top.

VS-ExternalWebTools

Restart VS (not sure if it is needed but it´s probably best anyway)

If you have a project with a current node_modules folder created before the npm upgrade, then delete the node_modules folder before you open the project in VS to avoid annoying errors.

And now the VS build should work.
If you already had a node_modules folder you can see that the new folder has a lot more sub folders, because more of the dependencies are installed in the “root” now.

Happy coding!
//Jimi