Npm install fails for Phoenix LiveView app in Windows 10

Background

I have a Phoenix app, in a fresh Windows 10 VM. In this project I cannot run npm install without errors.

Problem

After running npm install inside the assets directory I get the following output:

λ npm install
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm ERR! code 1
npm ERR! path C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
npm ERR! Build started 11/11/2021 9:26:11 AM.
npm ERR! Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.sln" on node 1 (default targets).
npm ERR! ValidateSolutionConfiguration:
npm ERR!   Building solution configuration "Release|x64".
npm ERR! Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.sln" (1) is building "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.vcxproj.metaproj" (2) on node 1 (default targets).
npm ERR! Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.vcxproj.metaproj" (2) is building "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\src\libsass.vcxproj" (3) on node 1 (default targets).
npm ERR! C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\src\libsass.vcxproj(20,3): error MSB4019: The imported project "C:\Microsoft.Cpp.Default.props" was not found. Confirm that the path in the <Import> declaration is correct, and that the file exists on disk.
npm ERR! Done Building Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\src\libsass.vcxproj" (default targets) -- FAILED.
npm ERR! Done Building Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.vcxproj.metaproj" (default targets) -- FAILED.
npm ERR! Done Building Project "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.sln" (default targets) -- FAILED.
npm ERR!
npm ERR! Build FAILED.
npm ERR!
npm ERR! "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.sln" (default target) (1) ->
npm ERR! "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\binding.vcxproj.metaproj" (default target) (2) ->
npm ERR! "C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\src\libsass.vcxproj" (default target) (3) ->
npm ERR!   C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\src\libsass.vcxproj(20,3): error MSB4019: The imported project "C:\Microsoft.Cpp.Default.props" was not found. Confirm that the path in the <Import> declaration is correct, and that the file exists on disk.
npm ERR!
npm ERR!     0 Warning(s)
npm ERR!     1 Error(s)
npm ERR!
npm ERR! Time Elapsed 00:00:00.05
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli   'C:\\Program Files\\nodejs\\node.exe',
npm ERR! gyp verb cli   'C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli   'rebuild',
npm ERR! gyp verb cli   '--verbose',
npm ERR! gyp verb cli   '--libsass_ext=',
npm ERR! gyp verb cli   '--libsass_cflags=',
npm ERR! gyp verb cli   '--libsass_ldflags=',
npm ERR! gyp verb cli   '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@17.0.1 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2.7" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2.7
npm ERR! gyp verb `which` failed     at getNotFoundError (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed     at F (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed     at E (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed  python2.7 Error: not found: python2.7
npm ERR! gyp verb `which` failed     at getNotFoundError (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed     at F (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed     at E (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed     at C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed   code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb could not find "python2.7". checking python launcher
npm ERR! gyp verb check python launcher python executable found: "C:\\Users\\User\\.windows-build-tools\\python27\\python.exe"
npm ERR! gyp verb check python version `C:\Users\User\.windows-build-tools\python27\python.exe -c "import sys; print "2.7.15
npm ERR! gyp verb check python version .%s.%s" % sys.version_info[:3];"` returned: %j
npm ERR! gyp verb get node dir no --target version specified, falling back to host node version: 17.0.1
npm ERR! gyp verb command install [ '17.0.1' ]
npm ERR! gyp verb install input version string "17.0.1"
npm ERR! gyp verb install installing version: 17.0.1
npm ERR! gyp verb install --ensure was passed, so won't reinstall if already installed
npm ERR! gyp verb install version is already installed, need to check "installVersion"
npm ERR! gyp verb got "installVersion" 9
npm ERR! gyp verb needs "installVersion" 9
npm ERR! gyp verb install version is good
npm ERR! gyp verb get node dir target node version installed: 17.0.1
npm ERR! gyp verb build dir attempting to create "build" dir: C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build
npm ERR! gyp verb build dir "build" dir needed to be created? C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build
npm ERR! gyp verb build/config.gypi creating config file
npm ERR! gyp verb build/config.gypi writing out config file: C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\build\config.gypi
npm ERR! (node:7852) [DEP0150] DeprecationWarning: Setting process.config is deprecated. In the future the property will be read-only.
npm ERR! (Use `node --trace-deprecation ...` to show where the warning was created)
npm ERR! gyp verb config.gypi checking for gypi file: C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\config.gypi
npm ERR! gyp verb common.gypi checking for gypi file: C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass\common.gypi
npm ERR! gyp verb gyp gyp format was not specified; forcing "msvs"
npm ERR! gyp info spawn C:\Users\User\.windows-build-tools\python27\python.exe
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   'C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-gyp\\gyp\\gyp_main.py',
npm ERR! gyp info spawn args   'binding.gyp',
npm ERR! gyp info spawn args   '-f',
npm ERR! gyp info spawn args   'msvs',
npm ERR! gyp info spawn args   '-G',
npm ERR! gyp info spawn args   'msvs_version=2015',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   'C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-sass\\build\\config.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   'C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-gyp\\addon.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   'C:\\Users\\User\\.node-gyp\\17.0.1\\include\\node\\common.gypi',
npm ERR! gyp info spawn args   '-Dlibrary=shared_library',
npm ERR! gyp info spawn args   '-Dvisibility=default',
npm ERR! gyp info spawn args   '-Dnode_root_dir=C:\\Users\\User\\.node-gyp\\17.0.1',
npm ERR! gyp info spawn args   '-Dnode_gyp_dir=C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-gyp',
npm ERR! gyp info spawn args   '-Dnode_lib_file=C:\\Users\\User\\.node-gyp\\17.0.1\\<(target_arch)\\node.lib',
npm ERR! gyp info spawn args   '-Dmodule_root_dir=C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-sass',
npm ERR! gyp info spawn args   '-Dnode_engine=v8',
npm ERR! gyp info spawn args   '--depth=.',
npm ERR! gyp info spawn args   '--no-parallel',
npm ERR! gyp info spawn args   '--generator-output',
npm ERR! gyp info spawn args   'C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-sass\\build',
npm ERR! gyp info spawn args   '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! gyp verb command build []
npm ERR! gyp verb build type Release
npm ERR! gyp verb architecture x64
npm ERR! gyp verb node dev dir C:\Users\User\.node-gyp\17.0.1
npm ERR! gyp verb found first Solution file build/binding.sln
npm ERR! gyp verb could not find "msbuild.exe" in PATH - finding location in registry
npm ERR! gyp info spawn C:\Program Files (x86)\MSBuild\14.0\bin\msbuild.exe
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   'build/binding.sln',
npm ERR! gyp info spawn args   '/nologo',
npm ERR! gyp info spawn args   '/p:Configuration=Release;Platform=x64'
npm ERR! gyp info spawn args ]
npm ERR! gyp ERR! build error
npm ERR! gyp ERR! stack Error: `C:\Program Files (x86)\MSBuild\14.0\bin\msbuild.exe` failed with exit code: 1
npm ERR! gyp ERR! stack     at ChildProcess.onExit (C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-gyp\lib\build.js:262:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:390:28)
npm ERR! gyp ERR! stack     at Process.ChildProcess._handle.onexit (node:internal/child_process:290:12)
npm ERR! gyp ERR! System Windows_NT 10.0.19043
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\User\\Workplace\\market_manager\\apps\\web_interface\\assets\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd C:\Users\User\Workplace\market_manager\apps\web_interface\assets\node_modules\node-sass
npm ERR! gyp ERR! node -v v17.0.1
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\User\AppData\Local\npm-cache\_logs\2021-11-11T17_26_17_515Z-debug.log

I am using Node v17.0.1, the latest version with all the dependencies installed.

What I have tried

My first reaction was to downgrade Node to the LTS, in this case v16.X. (a fine reminder from the past:

)
However that didn’t work either.

Then I tried to manually download the VSCode tools dependencies manually and to setup everything manually. That was also a dead end.

I am running all the command in a shell with Admin privileges.

At this point I don’t know what else to try.

Question

How can I fix this?

Try downgrading more. I’ve had success with 15.7.0 after trying several other versions unsuccessfully.

1 Like

Since it’s node-sass that’s failing (again), it would be easiest to remove it and use the package sass instead, though I don’t know if that breaks the build then. This is why the latest Phoenix version uses esbuild with only CSS, less breaking parts.

So in theory, if I upgrade to the latest Phoenix version, I should avoid this problem, right ?

You would need to generate a new project with the latest generator, or adapt your project to match what it generates. Just upgrading Phoenix in an existing project won’t change the asset pipeline.

Note that the new generator indeed doesn’t have SCSS (just plain CSS) so if you want SCSS, you’ll have to add that back somehow (probably someone on the forum has done it).

Just to be clear, if I migrate my project to this new version, I wont need to go inside of the assets folder and run npm install ever again, right ?

Well if you need to install JS libraries, then you have two options suggested by the documentation: either copy the sources to a vendor directory manually (vendoring), or use npm to install them like normally. It’s up to you what to do.

If you don’t have the need for external JS libraries then you don’t need npm at all.