1

I'm trying to run a server on heroku that has a directory that looks something like

my-app
    server.js
    package.json
    client
        src
        dist
        package.json

The nested package.json has a scripts section that contains

      "scripts": {
        "start": "webpack-dev-server --open --mode development",
        "build": "webpack --mode production"
      },

The outer package.json has a scripts section like this

      "scripts": {
        "start": "node server",
        "build": "cd client/ && npm install && npm run build"
      },

When I push my project to heroku, I receive this output, and it just loops forever

     Build
    remote:        Running build
    remote:        
    remote:        > my-app@1.0.0 build /tmp/build_myapp
    remote:        > cd client/ && npm install && npm run build
    remote:
    remote:        audited 259 packages in 2.495s
    remote:        
    remote:        3 packages are looking for funding
    remote:          run `npm fund` for details
    remote:
    remote:        found 1 low severity vulnerability
    remote:          run `npm audit fix` to fix them, or `npm audit` for details
    remote:        
    remote:        > my-app@1.0.0 build /tmp/build_myapp
    remote:        > cd client/ && npm install && npm run build
    remote:
    remote:        audited 259 packages in 2.252s
    remote:        
    remote:        3 packages are looking for funding
    remote:          run `npm fund` for details
    remote:
    remote:        found 1 low severity vulnerability
    remote:          run `npm audit fix` to fix them, or `npm audit` for details
    remote:        
    remote:        > my-app@1.0.0 build /tmp/build_myapp
    remote:        > cd client/ && npm install && npm run build
    remote:
    remote:        audited 259 packages in 2.238s
    remote:        
    remote:        3 packages are looking for funding
    remote:          run `npm fund` for details

I have a node server on a github repo. One of the folders within this repo is a client folder, which has it's own github repo. I push everything to heroku using git push heroku master from within the server folder.

Sam
  • 1,765
  • 11
  • 82
  • 176

2 Answers2

2

Most likely because build command is running itself again and again, you can fix this by changing name of the outer script to something other than build, let's say buildClient

"scripts": {
    "start": "node server",
    "buildClient": "cd client/ && npm install && npm run build"
},

and run npm run-script buildClient instead of npm build.

Not sure if you can run custom script on heroku or not, but you should be able to rename script from build to heroku-postbuild and it should work.

Dipen Shah
  • 25,562
  • 1
  • 32
  • 58
  • Thanks, I'm getting a different error now `App not compatible with buildpack: https://github.com/kreativgebiet/heroku-buildpack-webpack ... ! [remote rejected] master -> master (pre-receive hook declined) error: failed to push some refs to ...`. [I've read that it could have something to do with a requirements.txt file](https://stackoverflow.com/questions/46109465/app-not-compatible-with-buildpack-heroku). I added an empty `requirements.txt` file, but am still getting the same error. Do you know how to fix this? – Sam Oct 22 '20 at 16:41
  • @Sam do you have `index.js` file in your source? May be you can share your log in pastebin. – Dipen Shah Oct 22 '20 at 17:05
  • No I don't, I named it `server.js` cause I thought it was more clear. I'll change it and see what happens – Sam Oct 22 '20 at 17:12
  • Also, one more thing your plugin is also checking for `webpack.config.js` in the root directory https://github.com/kreativgebiet/heroku-buildpack-webpack/blob/master/bin/detect – Dipen Shah Oct 22 '20 at 17:13
  • Webpack exists in a sub directory, I have a setup with a server in the root directory which is a node server, and a folder called `client` within the root folder. The client folder has a `webpack.config.js`, it's own git repo and is another project. – Sam Oct 22 '20 at 17:16
  • There was no change after switching `server.js` to `index.js`. I updated my `package.json` scripts section to have `"start": "node index.js",` and my Procfile to be `web: node index.js` also – Sam Oct 22 '20 at 17:25
  • @Sam I haven't used buildpack with multi application setup so unless I can check config files and run it, mostly I will be shooting in the dark. Did you try it using: https://elements.heroku.com/buildpacks/heroku/heroku-buildpack-multi-procfile? – Dipen Shah Oct 22 '20 at 17:31
  • So I have a single heroku app, which serves my front end from one of it's ports, but 2 github repos, one for the server and one for the client. It's the opposite scenario of what's described in the link from your last comment – Sam Oct 22 '20 at 17:37
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/223472/discussion-between-dipen-shah-and-sam). – Dipen Shah Oct 22 '20 at 17:40
1

I think that you should use Procfile like this.

web: npm run start

The outer package.json is like this.

"scripts": {
  "start": "node server",
  "heroku-postbuild": "cd client/ && npm install && npm run build"
},

If that doesn't work, check out this article. How to deploy multiple apps in a monorepo with Heroku
This article mentions multiple apps on heroku, which should be helpful

HandDot
  • 322
  • 1
  • 6
  • Thanks, I'm getting a different error now `App not compatible with buildpack: https://github.com/kreativgebiet/heroku-buildpack-webpack ... ! [remote rejected] master -> master (pre-receive hook declined) error: failed to push some refs to ...`. [I've read that it could have something to do with a requirements.txt file](https://stackoverflow.com/questions/46109465/app-not-compatible-with-buildpack-heroku). I added an empty `requirements.txt` file, but am still getting the same error. Do you know how to fix this? – Sam Oct 22 '20 at 16:41