Получить Webpack-Dev-Server, работающий в Webpack2

Question

Я не могу заставить Webpack-dev-сервер работать с webpack2.

Я использую версию: webpack@2.1.0-beta.25 & webpack-dev-server@2.1.0-beta.10

Im получаю следующий журнал CLI:

http://localhost:8080/ 
webpack result is served from/
content is served from /var/www/homelyfe/hl-app/app/index.js 
Hash: 2830dae8362c968c034c 
Version: webpack 2.1.0-beta.25 
Time: 544ms 
     Asset  Size Chunks    Chunk Names 
run.build.js 47.6 kB  0 [emitted] app 
    index.html 198 bytes   [emitted] 
chunk {0} run.build.js (app) 43.4 kB [entry] [rendered] 
    [0] ./app/index.js 69 bytes {0} [built] 
    [1] (webpack)-dev-server/client?http://localhost:8080 4.14 kB {0} [built] 
    [2] ./~/punycode/punycode.js 14.7 kB {0} [built] 
    [3] ./~/querystring-es3/index.js 127 bytes {0} [built] 
    [4] ./~/url/url.js 23.3 kB {0} [built] 
    [5] (webpack)/buildin/global.js 506 bytes {0} [built] 
    [6] (webpack)/buildin/module.js 548 bytes {0} [built] 
    [7] multi app 40 bytes {0} [built] 

ERROR in (webpack)-dev-server/client?http://localhost:8080 
Module not found: Error: Can't resolve './socket' in '/var/www/homelyfe/hl-app/node_modules/webpack-dev-server/client' 
@ (webpack)-dev-server/client?http://localhost:8080 4:13-32 
@ multi app 

ERROR in (webpack)-dev-server/client?http://localhost:8080 
Module not found: Error: Can't resolve 'strip-ansi' in '/var/www/homelyfe/hl-app/node_modules/webpack-dev-server/client' 
@ (webpack)-dev-server/client?http://localhost:8080 3:16-37 
@ multi app 

ERROR in (webpack)-dev-server/client?http://localhost:8080 
Module not found: Error: Can't resolve 'webpack/hot/emitter' in '/var/www/homelyfe/hl-app/node_modules/webpack-dev-server/client' 
@ (webpack)-dev-server/client?http://localhost:8080 124:19-49 
@ multi app 

ERROR in ./~/url/url.js 
Module not found: Error: Can't resolve './util' in '/var/www/homelyfe/hl-app/node_modules/url' 
@ ./~/url/url.js 25:11-28 
@ (webpack)-dev-server/client?http://localhost:8080 
@ multi app 

ERROR in ./~/querystring-es3/index.js 
Module not found: Error: Can't resolve './decode' in '/var/www/homelyfe/hl-app/node_modules/querystring-es3' 
@ ./~/querystring-es3/index.js 3:33-52 
@ ./~/url/url.js 
@ (webpack)-dev-server/client?http://localhost:8080 
@ multi app 

ERROR in ./~/querystring-es3/index.js 
Module not found: Error: Can't resolve './encode' in '/var/www/homelyfe/hl-app/node_modules/querystring-es3' 
@ ./~/querystring-es3/index.js 4:37-56 
@ ./~/url/url.js 
@ (webpack)-dev-server/client?http://localhost:8080 
@ multi app 
Child html-webpack-plugin for "index.html": 
    chunk {0} index.html 539 kB [entry] [rendered] 
     [0] ./~/lodash/lodash.js 537 kB {0} [built] 
     [1] (webpack)/buildin/global.js 506 bytes {0} [built] 
     [2] (webpack)/buildin/module.js 548 bytes {0} [built] 
     [3] ./~/html-webpack-plugin/lib/loader.js!./~/html-webpack-plugin/default_index.ejs 540 bytes {0} [built] 
webpack: bundle is now VALID. 

---

Моего webpack.config.js файл выглядит следующим образом:

const path = require("path"); 
const merge = require("merge"); 
const htmlWebpackPlugin = require("html-webpack-plugin"); 
const parts = require("./webpack.config.parts"); 
const PATHS = { 
    app : path.join(__dirname, "app"), 
    build : path.join(__dirname, "build") 
}; 

const common = { 
    entry : { 
     app : PATHS.app + "/index.js" 
    }, 
    output : { 
     filename : "run.build.js", 
     path : PATHS.build 
    }, 
    resolve : { 
     alias : { 
      components : path.resolve(__dirname, "app/components") 
     }, 
     extensions : [ "js", "jsx" ] 
    }, 
    devServer : { 
     contentBase : PATHS.app 
    }, 
    module : { 
     rules : [ 
      { 
       test : "/\.jsx?$/", 
       use : [ 
        { 
         loader : "babel-loader", 
         options : { 
          presets : [ 
           "react", 
           "es2015" 
          ] 
         } 
        } 
       ] 
      } 
     ] 
    }, 
    plugins : [ 
     new htmlWebpackPlugin({ 
      title : "!!! testing webpack2 !!!" 
     }) 
    ] 
}; 

var config;  
switch(process.env.npm_lifecycle_event){ 
    case("buildProd"): 
     config = merge(common, 
          {}); 
    case("startDev"): 
    default: 
     config = merge(common, 
          { 
           devServer : { 
            contentBase : PATHS.app 
           } 
          }); 
} 
module.exports = config; 

Что мне не хватает?

Answer 1

Решение должно было передать опцию --no-inline в скрипт в package.json. Таким образом, в package.json, то scripts OBJ будет:

"scripts" : { 
    "startDev" : "webpack-dev-server --no-inline" 
} 

https://webpack.js.org/configuration/dev-server/#devserver-inline-cli-only