Next.js: HMR Not working for Clean URLs (when redirecting to /pages/index.js)

[dfvalero]

Bug report

HMR is not working for custom URL. If you redirect to index it will fail, if you redirect to another file, it will work.

To Reproduce

1. run npm run dev
2. update something in /pages/index.js file
3. next compiles but browser doesn't update

Expected behavior

Browser updates

System information

• OS: [e.g. macOS]
• Browser: chrome
• Version of Next.js: 8.0.3

Additional context

server.js file:

const express = require('express');
const next = require('next');

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare()
  .then(() => {
    const server = express();

    server.get('/test', (req, res) => {
      app.render(req, res, '/index', {});
    });

    server.get('*', handle);

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

/pages/index.js:

import React, { Component } from 'react';

class Index extends Component {
 render() {
   return (
     <div>
       <p>Hello Next.js</p>
     </div>
   )
 }
}

export default Index;

[dmitweb]

Same issue 8.0.4-canary.6, work on 7.0.3, didn't work on 8.0.0
@dfvalero u can temp use workaround, create page called ex: main.js, don't use index.js until fix

[dfvalero]

@dmitweb That's what I did, I created a file called app.js. Thanks for the advice!

[ijjk]

@dfvalero I tried out your example and after changing app.render(req, res, '/index', {}); to app.render(req, res, '/', {}); HMR appears to be working fine. Can you confirm this?

[dmitweb]

@ijjk y, works as expected

[dfvalero]

@ijjk Yes! :)