Next.js: How to deploy Next.js with Express and external Babel?

Created on 11 May 2018 · 5Comments · Source: vercel/next.js

It is my first application with Next.js and I am facing problems to deploy the project to Heroku.
I am using Express server and a external .babelrc file.

[x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

No errors building/running project in Heroku.

Current Behavior

I am running yarn build and then git init / add / commit / push in .next/dist folder and copying package.json into it too.

Context

This is my scripts from package.json:

"scripts": {
    "start": "NODE_ENV=production node server/server.js",
    "dev": "nodemon -w server server/server.js --exec babel-node",
    "build": "next build && babel server -d .next/dist/server",
    "lint": "eslint --fix components lib pages server **/*.js",
    "snyk": "snyk test",
    "heroku-postbuild": "next build && babel server -d .next/dist/server"
  }

next.config.js:

module.exports = {
  webpack: (config, { dev }) => {
    // For the development version, we'll use React.
    // Because, it support react hot loading and so on.
    if (dev) {
      return config;
    }

    config.resolve.alias = {
      react: 'inferno-compat',
      'react-dom': 'inferno-compat'
    };
    return config;
  }
};

And the .babelrc:

{
  "presets": [
    [
      "next/babel",
      {
        "preset-env": {
          "modules": "commonjs"
        }
      }
    ]
  ],
  "env": {
    "development": {
      "plugins": ["inline-dotenv"]
    },
    "production": {
      "plugins": ["transform-inline-environment-variables"]
    }
  }
}

Your Environment

| Tech | Version |
|---------|---------|
| next | 6.0.1 |
| node | 9.5.0 |
| @babe/* | ^7 |

Source

gcfabri

All 5 comments

Please, I need some help...

gcfabri on 14 May 2018

I'm not sure what the issue is here.

I am running yarn build and then git init / add / commit / push in .next/dist folder and copying package.json into it too.

This sounds like a weird thing to do.

Also you're building your custom server to .next/dist and then starting it from server/server.js.

timneutkens on 14 May 2018

👎3

I changed the start script to point to .next / dist .. Heroku is getting 'request timeout' ..

gcfabri on 14 May 2018

@timneutkens So how can we write custom server, that uses bundled version of next? Or do you expect us to put entire repository contents + node_modules (from which we need only express and next, but polluted with webpack, babel, react, etc. due to "next build") into the production servers?