CODEWITHSUNDEEP
expressnext.jsnodemon
Лукас
Лукас

Reputation: 271

How to set up nodemon in nextjs + express?

My server main file looks like this

const express = require("express");
const next = require("next");
const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== "production";

const app = next({ dev });
const handle = app.getRequestHandler();

app
  .prepare()
  .then(() => {
    const server = express();
    server.use(express.json());
    require("./routes/indexRouter")(server, app);
    server.all("*", (req, res) => {
      return handle(req, res);
    });

    server.listen(port, (err) => {
      if (err) throw err;
      console.log("> Ready on http://localhost:" + port);
    });
  })
  .catch((ex) => {
    console.error(ex.stack);
    process.exit(1);
  });

nodemon.json

{
  "verbose": true,
  "ignore": ["node_modules", ".next"],
  "watch": ["server/**/*", "app.js"],
  "ext": "js json"
}

enter image description here

nodemon quickly reloads app.js when the file is changed, but nextJS compilation takes a very long time, for this reason I have to wait until everything is compiled before I see the result in the browser. I would like to just work with the server without doing mindless re-compilations of the nextJS project

Upvotes: 3

Views: 9568

Answers (1)

nkangi jafari
nkangi jafari

Reputation: 93

Nodemon needs on when to reload. Add a nodemon file on the root and paste this code in it.

{
  "verbose": true,
  "ignore": ["node_modules", ".next"],
  "watch": ["server/**/*", "server.js"],
  "ext": "js json"
}

And then go to your package.json file and replace the dev script to nodemon as shown below.

"dev": "nodemon -w server/server.js server/server.js",

Read this blog for more info. https://dev.to/whoisryosuke/nextjs-tip-hot-reloading-for-dynamic-servers-43ed

Upvotes: 1

Related Questions