Make Express Static stop “pending” with Node 14?

Question

I asked this question half a year ago, but I'm still having the same issue: Express Static network requests stuck on "pending"

Tl;dr: Node 14 + Webpack watch mode + Express Static causes the browser to hang every time I change a JS file. This occurs in multiple browsers, after restarting the server, and after clearing the cache.

The 2 ways to get the browser to stop hanging are:

• close and reopen the tab
• go to the homepage (http://localhost)

This issue doesn't occur in Node 12. Is there any way to get the browser to stop hanging in Node 14+?

Edit: Here's my Express code, working on a repo for repro:

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(cors({
  origin: HOME_URL,
  optionsSuccessStatus: 200,
}));
app.disable('x-powered-by');

app.use('/api', apiRoutes);
app.use('/sse', sseRoute);

if (process.env.SERVER !== 'production') {
  app.use('/', express.static(
    path.resolve('./build/web'),
    { dotfiles: 'allow' },
  ));

  app.get('*', async (req, res) => {
    const indexFile = await fs.promises.readFile(
      path.resolve('./build/web/index.html'),
    );
    res.send(indexFile.toString());
    res.end();
  });
} else {
  app.all('*', (req, res, next) => {
    if (req.secure || !USE_SSL) {
      next();
    } else {
      res.redirect(`https://${req.hostname}${req.url}`);
    }
  });

  app.use('/', express.static(path.resolve('../web')));

  const indexFile = fs.readFileSync(path.resolve('../web/index.html')).toString();
  app.use('*', async (req, res) => {
    res.send(indexFile);
    res.end();
  });
}

Answer 1

If you are serving SPA as a static content, can you try to change this part:

app.use('/', express.static(path.resolve('../web')));

  const indexFile = fs.readFileSync(path.resolve('../web/index.html')).toString();
  app.use('*', async (req, res) => {
    res.send(indexFile);
    res.end();
  });

with this:

const path = require('path');
const rootPath = path.normalize(__dirname);

// Serve Angular/React frontend files 
app.use('/', express.static(rootPath + '/web', { redirect: false }));

// Rewrite virtual urls to Angular/React app
app.get('*', function (req, res, next) {
    res.sendFile(path.resolve(rootPath + '/web/index.html'));
});

Answer 2

I think it was fixed by changing app.use('/', express.static( to app.use(express.static(