Running webpack in VSTS / TFS, cannot find webpack

Question

In my build process in VSTS I run npm install -g webpack then npm install webpack both with working dir set to website project dir ( the dir where project.json and other main files are located as opposed to solution dir).

Then I run where webpack in command line task

or Get-Command -CommandType Application -ErrorAction SilentlyContinue -Name webpack | Select-Object -ExpandProperty Definition | echo in powershell task

and they both only return empty string.

So obviously runnig webpack -p as the as the next command only returns 'not found' type of response.

The term 'webpack' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again.

Here are the npm listings for the global:

2016-11-04T15:11:38.0395583Z ##[section]Starting: npm install
2016-11-04T15:11:38.6826226Z [command]C:\Program Files\nodejs\npm.cmd install -g webpack
2016-11-04T15:11:48.7566299Z C:\Users\SrvBuildAgentUser\AppData\Roaming\npm\webpack -> C:\Users\SrvBuildAgentUser\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js
2016-11-04T15:11:48.8726415Z C:\Users\SrvBuildAgentUser\AppData\Roaming\npm
2016-11-04T15:11:48.8726415Z `-- webpack@1.13.3 
2016-11-04T15:11:48.8726415Z 
2016-11-04T15:11:48.8736416Z npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\webpack\node_modules\chokidar\node_modules\fsevents):
2016-11-04T15:11:48.8976440Z npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.15: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
2016-11-04T15:11:48.9066449Z ##[section]Finishing: npm install

and for the one without global:

2016-11-04T15:11:48.9086451Z ##[section]Starting: npm install
2016-11-04T15:11:49.5467089Z [command]C:\Program Files\nodejs\npm.cmd install webpack
2016-11-04T15:11:56.8194361Z asp.net@1.0.0 C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite
2016-11-04T15:11:56.8204362Z +-- UNMET DEPENDENCY rxjs@5.0.0-beta.12
2016-11-04T15:11:56.8204362Z `-- webpack@1.13.3 
2016-11-04T15:11:56.8204362Z 
2016-11-04T15:11:56.8214363Z npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
2016-11-04T15:11:56.8214363Z npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.15: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
2016-11-04T15:11:56.8224364Z npm WARN asp.net@1.0.0 requires a peer of rxjs@5.0.0-beta.12 but none was installed.
2016-11-04T15:11:56.8504392Z ##[section]Finishing: npm install

and then the webpack -p will just fail with:

2016-11-04T15:11:56.8524394Z ##[section]Starting: PowerShell Script
2016-11-04T15:11:56.9024444Z ##[command]. 'C:\Users\SrvBuildAgentUser\AppData\Local\Temp\d8093b24-25d4-4c1d-aeab-5f9f41abb954.ps1' 
2016-11-04T15:11:57.9345476Z C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite
2016-11-04T15:11:58.4295971Z ##[error]webpack : The term 'webpack' is not recognized as the name of a cmdlet, functio
n, script file, or operable program. Check the spelling of the name, or if a pa
th was included, verify that the path is correct and try again.
At C:\Users\SrvBuildAgentUser\AppData\Local\Temp\d8093b24-25d4-4c1d-aeab-5f9f41
abb954.ps1:7 char:1
+ webpack -p
+ ~~~~~~~
    + CategoryInfo          : ObjectNotFound: (webpack:String) [], CommandNotF 
   oundException
    + FullyQualifiedErrorId : CommandNotFoundException


2016-11-04T15:11:58.4355977Z ##[error]Process completed with exit code 0 and had 1 error(s) written to the error stream.
2016-11-04T15:11:58.4375979Z ##[section]Finishing: PowerShell Script

So I even pushed node_modules/.bin/ to repo and I tried to run node_modules\.bin\webpack

and so it found the webpack but it messes up paths and won't find some modules:

2016-11-04T14:47:02.4346130Z ##[section]Starting: Run node_modules\.bin\webpack
2016-11-04T14:47:02.4366130Z ##[command]node_modules\.bin\webpack -p
2016-11-04T14:47:04.6596130Z Hash: 6a3774e770e7be6ac786
2016-11-04T14:47:04.6596130Z Version: webpack 1.13.3
2016-11-04T14:47:04.6596130Z Time: 925ms
2016-11-04T14:47:04.6596130Z            Asset       Size  Chunks             Chunk Names
2016-11-04T14:47:04.6596130Z vendor.bundle.js  734 bytes       0  [emitted]  vendor
2016-11-04T14:47:04.6596130Z   main.bundle.js    33.4 kB    1, 0  [emitted]  main
2016-11-04T14:47:04.6596130Z    [0] ./app/main.js 500 bytes {1} [built] [2 errors]
2016-11-04T14:47:04.6596130Z    [1] ./app/Helpers.js 1.62 kB {1} [built]
2016-11-04T14:47:04.6596130Z    [2] ./app/ProductAccessibilityValidator.js 2.06 kB {1} [built] [2 errors]
2016-11-04T14:47:04.6606130Z    [3] ./app/UserProfileProvider.js 1.74 kB {1} [built] [3 errors]
2016-11-04T14:47:04.6606130Z   [10] ./app/app.routing.js 1.93 kB {1} [built] [1 error]
2016-11-04T14:47:04.6606130Z   [11] ./app/component.js 1.22 kB {1} [built] [1 error]
2016-11-04T14:47:04.6606130Z   [20] ./app/module.js 4.09 kB {1} [built] [4 errors]
2016-11-04T14:47:04.6606130Z     + 14 hidden modules
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z WARNING in main.bundle.js from UglifyJs
2016-11-04T14:47:04.6606130Z Side effects in initialization of unused variable SearchResult [./app/components/search-page.component.js:20,0]
2016-11-04T14:47:04.6606130Z Side effects in initialization of unused variable SearchResult [./app/components/product-search.component.js:20,0]
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/main.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/platform-browser-dynamic' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/main.js 2:33-77
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/main.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/core' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/main.js 3:13-37
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/module.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/core' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/module.js 11:13-37
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/module.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/platform-browser' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/module.js 12:25-61
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/module.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/forms' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/module.js 13:14-39
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/module.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/http' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/module.js 14:13-37
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/app.routing.js
2016-11-04T14:47:04.6606130Z Module not found: Error: Cannot resolve module '@angular/router' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6606130Z  @ ./app/app.routing.js 2:15-41
2016-11-04T14:47:04.6606130Z 
2016-11-04T14:47:04.6606130Z ERROR in ./app/component.js
2016-11-04T14:47:04.6616130Z Module not found: Error: Cannot resolve module '@angular/core' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6616130Z  @ ./app/component.js 11:13-37
2016-11-04T14:47:04.6616130Z 
2016-11-04T14:47:04.6616130Z ERROR in ./app/UserProfileProvider.js
2016-11-04T14:47:04.6616130Z Module not found: Error: Cannot resolve module '@angular/core' in C:\agent_work\10\s\mySolution.Web## Heading ##Site\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6616130Z  @ ./app/UserProfileProvider.js 14:13-37
2016-11-04T14:47:04.6616130Z 
2016-11-04T14:47:04.6616130Z ERROR in ./app/UserProfileProvider.js
2016-11-04T14:47:04.6616130Z Module not found: Error: Cannot resolve module '@angular/http' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app
2016-11-04T14:47:04.6616130Z  @ ./app/UserProfileProvider.js 15:13-37
2016-11-04T14:47:04.6616130Z 
2016-11-04T14:47:04.6616130Z ERROR in ./app/components/product-search.component.js
2016-11-04T14:47:04.6616130Z Module not found: Error: Cannot resolve module '@angular/core' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app\components
2016-11-04T14:47:04.6616130Z  @ ./app/components/product-search.component.js 14:13-37 15:13-37
2016-11-04T14:47:04.6616130Z 
2016-11-04T14:47:04.6616130Z ERROR in ./app/components/product-search.component.js
2016-11-04T14:47:04.6616130Z Module not found: Error: Cannot resolve module '@angular/http' in C:\agent_work\10\s\mySolution.WebSite\src\mySolution.WebSite\wwwroot\app\components
2016-11-04T14:47:04.6616130Z  @ ./app/components/product-search.component.js 16:13-37
(and so on)

Can you help me fix this?

Answer 1

You can add Webpack integrated with VSTS from Marketplace to your VSTS. https://github.com/Dealogic/webpack-vsts-extension Then exactly like Gulp you can run webpack files.

Answer 2

The problem is that the global directory of node is probably not in the PATH of the user running the VSTS agent. You can probably target the webpack cmd helper using C:\NPM\Modules\webpack after installing it globally.