Herkoku Node Deployment with Subfolder

Question

i'm trying for hours now and have no idea left...maybe you have some :-)

I'm using react-starter-kit as my react-app and gitlab as my repository. I've enabled gitlab-ci to deploy and ship my app to heroku.

Ok fine, gitlab-ci works ... yeah

But react-starter-kit using an /build folder to serve all the assets and the minified etc app.

How i am able to get a runnable app on heroku via gitlab-ci? I've added the Procfile with this content: web: node ./build/server.js

The heroku log output is as follows:

2017-01-02T16:57:54.655686+00:00 heroku[web.1]: State changed from crashed to starting
2017-01-02T16:57:58.721166+00:00 heroku[web.1]: Starting process with command `node ./build/server.js`
2017-01-02T16:58:00.987643+00:00 heroku[web.1]: Process exited with status 1
2017-01-02T16:58:00.995852+00:00 heroku[web.1]: State changed from starting to crashed
2017-01-02T16:58:00.997060+00:00 heroku[web.1]: State changed from crashed to starting
2017-01-02T16:58:00.833548+00:00 app[web.1]: module.js:471
2017-01-02T16:58:00.833561+00:00 app[web.1]:     throw err;
2017-01-02T16:58:00.833562+00:00 app[web.1]:     ^
2017-01-02T16:58:00.833563+00:00 app[web.1]:
2017-01-02T16:58:00.833564+00:00 app[web.1]: Error: Cannot find module '/app/build/server.js'
2017-01-02T16:58:00.833565+00:00 app[web.1]:     at Function.Module._resolveFilename (module.js:469:15)
2017-01-02T16:58:00.833566+00:00 app[web.1]:     at Function.Module._load (module.js:417:25)
2017-01-02T16:58:00.833567+00:00 app[web.1]:     at Module.runMain (module.js:604:10)
2017-01-02T16:58:00.833567+00:00 app[web.1]:     at run (bootstrap_node.js:394:7)
2017-01-02T16:58:00.833568+00:00 app[web.1]:     at startup (bootstrap_node.js:149:9)
2017-01-02T16:58:00.833569+00:00 app[web.1]:     at bootstrap_node.js:509:3
2017-01-02T16:58:07.230342+00:00 heroku[web.1]: Starting process with command `node ./build/server.js`
2017-01-02T16:58:10.416437+00:00 heroku[web.1]: State changed from starting to crashed
2017-01-02T16:58:10.398239+00:00 heroku[web.1]: Process exited with status 1
2017-01-02T16:58:10.271567+00:00 app[web.1]: module.js:471
2017-01-02T16:58:10.271583+00:00 app[web.1]:     throw err;
2017-01-02T16:58:10.271584+00:00 app[web.1]:     ^
2017-01-02T16:58:10.271584+00:00 app[web.1]:
2017-01-02T16:58:10.271585+00:00 app[web.1]: Error: Cannot find module '/app/build/server.js'
2017-01-02T16:58:10.271586+00:00 app[web.1]:     at Function.Module._resolveFilename (module.js:469:15)
2017-01-02T16:58:10.271586+00:00 app[web.1]:     at Function.Module._load (module.js:417:25)
2017-01-02T16:58:10.271587+00:00 app[web.1]:     at Module.runMain (module.js:604:10)
2017-01-02T16:58:10.271588+00:00 app[web.1]:     at run (bootstrap_node.js:394:7)
2017-01-02T16:58:10.271588+00:00 app[web.1]:     at startup (bootstrap_node.js:149:9)
2017-01-02T16:58:10.271588+00:00 app[web.1]:     at bootstrap_node.js:509:3

To complete all informations, my gitlab-ci content:

image: node:latest

stages:
  - deploy

before_script:
  - npm install

deploy:
  stage: deploy
  only:
    - master
  script:
    - npm run build -- --release
    - apt-get update -yq
    - apt-get install ruby-dev rubygems -y
    - gem install dpl
    - dpl --provider=heroku --app=nice-app --api-key=$HEROKU_API_KEY

Please help me! Thanks!

UPDATE:

My Folder structure looks like this:

├── /build/
│   ├── /content/
│   ├── /public/
│   ├── /assets.js
│   ├── /package.json
│   ├── /server.js
├── /docs/
├── /node_modules/
├── /public/
├── /src/
│   ├── /components/
│   ├── /core/
│   ├── /data/
│   ├── /routes/
│   ├── /client.js
│   ├── /config.js
│   └── /server.js
├── /test/
├── /tools/
└── package.json

Content of root package.json looks like this:

{
  "private": true,
  "engines": {
    "node": ">=6.5",
    "npm": ">=3.10"
  },
  "dependencies": {
    ...
  },
  "devDependencies": {
    ...
  },
  "babel": {
    "presets": [
      "react",
      "node5",
      "stage-0"
    ],
    "env": {
      "test": {
        "plugins": [
          "rewire"
        ]
      }
    }
  },
  "eslintConfig": {
    "parser": "babel-eslint",
    "extends": "airbnb",
    "globals": {
      "__DEV__": true
    },
    "env": {
      "browser": true
    },
    "rules": {
      "arrow-parens": "off",
      "generator-star-spacing": "off",
      "import/extensions": "off",
      "import/no-extraneous-dependencies": "off",
      "react/forbid-prop-types": "off",
      "react/jsx-filename-extension": "off",
      "react/no-danger": "off",
      "react/no-unused-prop-types": "off"
    }
  },
  "stylelint": {
    "extends": "stylelint-config-standard",
    "rules": {
      "string-quotes": "single",
      "property-no-unknown": [
        true,
        {
          "ignoreProperties": [
            "composes"
          ]
        }
      ],
      "selector-pseudo-class-no-unknown": [
        true,
        {
          "ignorePseudoClasses": [
            "global",
            "local"
          ]
        }
      ]
    }
  },
  "scripts": {
    "lint:js": "eslint src tools",
    "lint:css": "stylelint \"src/**/*.{css,less,scss,sss}\"",
    "lint": "npm run lint:js && npm run lint:css",
    "test": "mocha \"src/**/*.test.js\" --require test/setup.js --compilers js:babel-register",
    "test:watch": "npm run test -- --reporter min --watch",
    "clean": "babel-node tools/run clean",
    "copy": "babel-node tools/run copy",
    "bundle": "babel-node tools/run bundle",
    "build": "babel-node tools/run build",
    "deploy": "babel-node tools/run deploy",
    "render": "babel-node tools/run render",
    "start": "babel-node tools/run start"
  }
}

and the package.json in the build folder looks like this:

{
  "private": true,
  "engines": {
    "node": ">=6.5",
    "npm": ">=3.10"
  },
  "dependencies": {
    ...
  },
  "scripts": {
    "start": "node server.js"
  }
}

Answer 1

So you can define artifacts inside of the gitlab YAML file. This allows you to pass built files from stage to stage.

artifacts:
    paths:
    - node_modules/
    - build/

Like so. However, when you pass this to the dpl library for heroku I've found it to not push the artifacts across (still worth mentioning because you can pass the build stage artifacts to the test stage etc).

what I do with my node apps is add a "postinstall" script to the package.json npm runs this script after npm install has finished.

I'm not sure why you have two package.json files with one in your build folder. You can use just the one in the root of your project and add these scripts

"scripts": {
    "start": "node build/server.js",
    "postinstall": "npm run build"
    "dev": "babel-node tools/run start",
    "build": "babel-node tools/run build"
  }

Heroku will automatically run npm run build after it has run npm install you can chain multiple together in the postinstall as well if you so desire.

"postinstall": "npm run lint && npm run build" don't know if you want to bail on the build if the linter returns an issue but you get the idea hopefully.

I'm currently struggling with the passing artifacts to heroku angle. If I fix this I'll be back to comment