Webpack not found, deploying to Heroku

Ok -- this has to do with devDependencies vs. Dependencies in package.json Also, by setting the Heroku config to NPM_CONFIG_PRODUCTION: false I was able to resolve this. Thx internet!

As others have said, Heroku runs node as production NODE_ENV=production, which means your devDependencies don't get installed. Heroku provides node specific build hooks though. I use heroku-prebuild to run npm install --dev, which installs all dependencies and devDependencies.

"scripts": { ..., "heroku-prebuild": "npm install --dev", ... }, 

Running your app NOT in production mode should probably be avoided. Often developers have "dev mode" specific code that will get filtered out when running in production. Plus if you're doing things a webpack build you definitely want to be in production mode to take advantage of minification, uglifying, etc.

Here's the details from Heroku.

Sometimes, developers need something more production-oriented than the preinstall and postinstall hooks in package.json. For instance, some apps need to set up extra authentication before installing dependencies. Some need to build assets, but not in a development environment. Further examples can be found in the discussion on GitHub.

Node.js developers can now use heroku-prebuild and heroku-postbuild hooks to tailor the build process to their apps.

https://devcenter.heroku.com/changelog-items/844

This happens because heroku by default doesn't install dev Dependencies of package.json, we need to exculsively tell heroku (npm) to install our dev dependencies (webpack is in dev), so running this command should solve the "not found issue"

.

npm install --dev 

What's causing this is devDependencies are not installed. You overcome this by typing the following command in your project's root dir:

heroku config:set NPM_CONFIG_PRODUCTION=false 

Then, the next time you deploy your app your issue should be resolved.

I misunderstood the problem so her for yarn users:

"heroku-prebuild": "yarn install --production=false" 

The problem is not the pruning that happens afterwards according to the docu (for npm at least) but yarn interpreting NODE_ENV and only installing production dependencies even in the pre-build phase.

To force yarn to "oversee" the env variable you have to give the --production=false flag. see https://yarnpkg.com/lang/en/docs/cli/install/

Note as mentioned in the comments installing dev dependencies in production is never a good idea. This is only meaningful for ruling out deployment issues.

This is what it worked for me https://github.com/rails/webpacker/issues/512

heroku buildpacks:add --index 1 heroku/nodejs

This behavior changed on 01.03.2018: https://devcenter.heroku.com/changelog-items/1376

It will install devDependencies but also prune them as part of deploy. Pruning can be skipped via heroku config:set NPM_CONFIG_PRODUCTION=false. This still leaves NODE_ENV set to production.

Like others have said, Heroku will prune devDependencies before running the specified package.json script to spin up the app.

I would still like Heroku to prune devDependencies since those packages are not actively needed while in production, only in the build process. Heroku allows for a customized build process which I was able to leverage to achieve the desired effect.

"scripts": { "heroku-prebuild": "npm install --dev", "build": "webpack --mode production", "start": "node src/app.js", } 

The pre-build will install dev dependencies, then the build script will simply use those dev dependencies to generate the webpack bundles. After which the devDependencies will be pruned regularly for production right before running the start script.