webpack-dev-server: "lazy" mode does not seem to work in the latest webpack-dev-server

Operating System: Windows 10 (crosschecked on Ubuntu 17.10)
Node Version: 8.4.0
NPM Version: 5.6.0
webpack Version: 4.0.0 (first spotted on 3.x)
webpack-dev-server Version: 3.0.0 (first spotted on 2.x)

This is a bug
This is a modification request

Code

https://github.com/sergebat/test-webpack-lazymode

'use strict';

module.exports = {
  entry: './app.js',
  mode: "development",
  output: {
    filename: "bundle.js"
  },
  devServer: {
    lazy: true,
    inline: false,
    filename: "bundle.js"
  }
};

Expected Behavior

http://localhost:8080/bundle.js should return bundle in Lazy mode when loaded in browser.

Actual Behavior

Browser displays: “Cannot GET /bundle.js”.

If lazy: true is removed, bundle.js returns fine.

I tried http://localhost:8080/dist/bundle.js, tried removing optional filename in devServer, tried removing inline: false. Neither of these options worked for me.

For Bugs; How can we reproduce the behavior?

Sync repo at https://github.com/sergebat/test-webpack-lazymode, then:

npx webpack-dev-server

and open bundle in browser.

For Features; What is the motivation and/or use-case for the feature?

About this issue

Original URL
State: closed
Created 6 years ago
Comments: 22 (9 by maintainers)

Most upvoted comments

Lazy was removed from webpack-dev-middleware due incompatibility with webpack and will be removed in next release

alexander-akait on Dec 18, 2019

@SpaceK33z interestingly enough, things seem work fine on webpack-dev-middleware: https://github.com/sergebat/test-webpack-lazymode/blob/master/testmw.js

File above works fine on Ubuntu node testmw.js for me (not on Windows, as things seem to be broken there the hard way, but that’s another issue I guess https://github.com/webpack/webpack-dev-middleware/issues/270)

At the same time, node_modules/.bin/webpack-dev-server displays “Cannot GET /bundle.js” for me on Ubuntu.

In case it helps someone diagnose the issue, it starts to work if path is explicitly and incorrectly specified like this:

'use strict';

module.exports = {
  entry: './app.js',
  mode: "development",
  output: {
    filename: "bundle.js",
    path: "/" // <- :) 
  },
  devServer: {
    lazy: true
  }
};

sergebat on Mar 4, 2018

@SpaceK33z thanks. I’ll try to reproduce with raw ‘webpack-dev-middleware’ over weekend, and if it occurs there, will create and link issue there.

sergebat on Mar 2, 2018