Next.js not automatically updating content on page edits

[subimage]

Thank you team for working on this much needed capability. It will help a few sites of mine be able to retire a mess of bash scripts that we use in our monorepo to deploy a Next.js site and Functions to Cloud Run as independent services.

My current project's directory setup looks like the following

/packages
  /functions
  /shared
  /web
firebase.json

I can get the site to appear at the port I've specified, but the page does not auto-reload on changes, and I cannot manually reload to see edit's I've made to the Next.js / React source code, as one might expect.

Can you please advise how I should have these configuration files setup to enable livereload for editing and development of the site?

/web is a Next.js site, which I'm trying to serve through firebase emulators:start using firebase.json file below.

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "functions": {
    "source": "./packages/functions",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "predeploy": [
      "npm --prefix \"$RESOURCE_DIR\" run lint",
      "npm --prefix \"$RESOURCE_DIR\" run build"
    ]
  },
  "hosting": {
    "source": "./packages/web/",
    "cleanUrls": true,
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
  },
  "storage": {
    "rules": "storage.rules"
  },
  "emulators": {
    "auth": {
      "port": 9099
    },
    "functions": {
      "port": 5001
    },
    "firestore": {
      "port": 8080
    },
    "hosting": {
      "port": 5050
    },
    "pubsub": {
      "port": 8085
    },
    "storage": {
      "port": 9199
    },
    "ui": {
      "port": 4444,
      "enabled": true
    }
  }
}

[davideast]

Hey @subimage! Thank you for filing an issue. We don't have support for this just yet, but we have it on our radar. There are some quirks we need to get right so it's a great dev experience.

[jamesdaniels]

Happy to report that dev-mode is now built into the latest generation of the tooling https://firebase.google.com/docs/hosting/nextjs

[alekseykarpenko]

@jamesdaniels If there is any configuration option to disable dev-mode manually?
Due to my issues with emulator (#63 and #64), I would now use next dev and run my app at localhost:3000 with proxying some specific routes to hosting at localhost:5000 so that my hosting rewrites to cloud functions work as expected.
But as now hosting emulator also uses dev-mode, I can't determine phase in next.config.js to avoid proxy looping.