Fast Refresh with Next.js development mode in VS Code Remote Container/devcontainer

Question

I can't get Next.js' Fast Refresh feature to work with a VS Code Remote Container. I can run npm run dev and see the app running on localhost on my machine, so the container works fine - only the Fast Refresh has no effect at all.

Next.js version: v11.0.1

I tried this both with Windows 10 and Ubuntu 20.04 (on WSL 2).

---

I already tried to use a custom webpack middleware in the next.config.js like so (see https://github.com/vercel/next.js/issues/2179#issuecomment-316568536):

module.exports = {
    webpackDevMiddleware: (config) => {
        // Solve compiling problem via vagrant
        config.watchOptions = {
            poll: 1000,   // Check for changes every second
            aggregateTimeout: 300,   // delay before rebuilding
        };
        return config;
    },
};

...which will trigger a recompile on code changes, but the browser does not update.

Also, the requests to "HMR" are failing:

---

How to reproduce:

1. Install the Remote Containers extension
2. Open any new folder
3. Open the command palette and type/select "Remote-Containers: Rebuild and Reopen in Container"
4. Type/select "Node.js"
5. Type/select version "16" and wait for the container to start
6. Go to the .devcontainer folder and open the devcontainer.json
7. Edit the config by adding "forwardPorts": [3002], to make the app available on your host and rebuild the container (via VS Code's command palette)
8. From the terminal, install Next.js, e.g.: npx create-next-app --use-npm --example with-typescript-eslint-jest my-app
9. Move all the files from my-app to your VS Code project root folder. This has to be done because create-next-app does not work installing in the project root folder via ., because there's already the .devcontainer folder.
10. Optional: Create a next.config.js and add the snippet for the Webpack dev middleware as seen above
11. Edit the package.json script to use a specific port: "dev": "next dev -p 3002", (or, if you use WSL 2: next dev -p 3002 -H ::)
12. From the terminal, start the app npm run dev
13. Open the browser on http://localhost:3002
14. The app is showing. Make changes in the code -> even a recompiled app will not show the changes in the browser. A reload of the page in the browser will show the changes though.

---

With Create React App, there's an advanced configuration without ejecting (called CHOKIDAR_USEPOLLING), which makes their Fast Refresh work with Remote Containers.

---

Earlier I created a feature request, but maybe someone already managed to make this work without huge changes in the configuration/setup?