VSTS webpack build task cannot find CLI

Question

I have a .NET (4.7) Web Application inside a project directory called MyWebApp.Web

As part of the build process I run npm install, webpack-cli is a dependency.

But when I run the webpack build task with MyWebApp.Web set as the working directory I get the following error:

Error: Cannot find module 'D:\a\1\s\MyWebApp.Web\node_modules\webpack\bin\webpack.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
    at Function.Module._load (internal/modules/cjs/loader.js:507:25)
    at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
    at startup (internal/bootstrap/node.js:236:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:560:3)

If I try and run webpack via an NPM script I get webpack's built in interactive "a CLI must be installed" prompt, indicating that the module cannot be found.

Is there anything I'm missing that needs to be in place for webpack to "see" the node modules?

Are you sure your npm packages are being installed correctly? Are you using npm install with the production flag turned on? That would prevent your dev dependencies from being installed. — Calidus
@Calidus well this is embarrassing, NODE_ENV was inndeed set to 'production'. Turned the flag off now webpack is running fine. — Jason Elkin
@JasonElkin The issue was resolved right? Then you could post your solution as an answer and accept it. This can be beneficial to other community members reading this thread. — Andy Li-MSFT

Jason Elkin Jason Elkin · Accepted Answer · 2018-07-10T10:22:51

It transpires that in the Variables tab process.env.NODE_ENV was set to production so dev dependencies were not being installed.

Removing this environment variable solved the problem.

I was doing this specifically to invoke webpack's "production" mode (partly because that's how the webpack Visual Studio extension works). This approach always worked on dev environments because the modules were already installed from previous development builds but on the VSTS build agent we were only ever running a production build.

I've now set up separate webpack.common.js, webpack.config.js (for dev), and webpack.prod.js files using webpack-merge, as per the webpack documentation. This targets different configs to different environments rather than relying on environment variables.

VSTS webpack build task cannot find CLI

2 Answers