0

I am trying to deploy my project to Heroku that uses webpack. I am following this tutorial on how to deploy my project with webpack. When I do git push heroku master, I am getting this error:

remote:        > webpack -p
remote:        
remote:        sh: 1: webpack: not found
remote:        
remote:        npm ERR! Linux 3.13.0-105-generic
remote:        npm ERR! argv "/tmp/build_4edddf9818027153c0f2847e8272d33e/.heroku/node/bin/node" "/tmp/build_4edddf9818027153c0f2847e8272d33e/.heroku/node/bin/npm" "install" "--unsafe-perm" "--userconfig" "/tmp/build_4edddf9818027153c0f2847e8272d33e/.npmrc"
remote:        npm ERR! node v6.9.5
remote:        npm ERR! npm  v3.10.10
remote:        npm ERR! file sh
remote:        npm ERR! code ELIFECYCLE
remote:        npm ERR! errno ENOENT
remote:        npm ERR! syscall spawn
remote:        npm ERR! fire-emblem-quiz@1.0.0 postinstall: `webpack -p`
remote:        npm ERR! spawn ENOENT
remote:        npm ERR!
remote:        npm ERR! Failed at the fire-emblem-quiz@1.0.0 postinstall script 'webpack -p'.
remote:        npm ERR! Make sure you have the latest version of node.js and npm installed.
remote:        npm ERR! If you do, this is most likely a problem with the fire-emblem-quiz package,
remote:        npm ERR! not with npm itself.
remote:        npm ERR! Tell the author that this fails on your system:
remote:        npm ERR!     webpack -p
remote:        npm ERR! You can get information on how to open an issue for this project with:
remote:        npm ERR!     npm bugs fire-emblem-quiz
remote:        npm ERR! Or if that isn't available, you can get their info via:
remote:        npm ERR!     npm owner ls fire-emblem-quiz
remote:        npm ERR! There is likely additional logging output above.
remote:

When I looked at the error message, it says that webpack is not found so I installed it as a dependency in my project. However, I am unable to deploy my project.

Here is my webpack configuration file:

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    filename: 'app/js/main.js'
  },
  module: {
    loaders: [{
      test: /\.jsx?$/,
      loader: 'babel',
      exclude: /node_modules/
    }]
  }
}

Here is my package.json file: 

{
  "name": ,
  "version": "1.0.0",
  "description": ,
  "main": "index.js",
  "scripts": {
    "start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js",
    "prod": "NODE_ENV=production node server.js",
    "postinstall": "webpack -p"
  },
  "author": ,
  "license": "ISC",
  "devDependencies": {
    "babel-core": "5.8.*",
    "babel-loader": "5.3.*",
    "webpack": "^1.14.0"
  },
  "dependencies": {
    "express": "^4.14.1",
    "react": "^15.4.2",
    "react-dom": "^15.4.2"
  }
}

I appreciate any help. Thanks.

emvo
  • 117
  • 2
  • 11
  • Please refer to http://stackoverflow.com/questions/41973338/hosting-a-production-react-app-built-with-wepback-on-heroku/41973881#41973881 – Yoni Rabinovitch Feb 14 '17 at 12:46
  • Hi. I followed your suggestion and I was able to resolved the webpack error message. When I push to heroku, everything seems to be building successfully, but I get a **Cannot GET /** page. Now, I am getting this error message: `WARNING in app/js/main.js from UglifyJs` and I am not too sure if it is all connected. I installed the dependencies from my devDependencies and still no go. Any suggestions at this point? – emvo Feb 14 '17 at 22:45
  • I suggest you post another question with full information about the problem you are facing now. – Yoni Rabinovitch Feb 15 '17 at 06:52

1 Answers1

0

Several approaches to the issue of missing webpack dependencies for Heroku when webpack is specified in the devDependencies of package.json have been suggested in the answers to Hosting a production React app built with Wepback on Heroku. Follow whatever approach suits you best.

Community
  • 1
  • 1
Yoni Rabinovitch
  • 5,171
  • 1
  • 23
  • 34