调整webpack-dev-server相关配置，实现LiveReload

Author: Array-Huang

package.json

@@ -5,8 +5,7 @@
   "scripts": {
     "build": "node npm-scripts/before-build.script.js && webpack --progress --colors --bail",
     "dev": "node npm-scripts/before-build.script.js && webpack --progress --colors --config ./webpack.dev.config.js",
-    "watch": "node npm-scripts/before-build.script.js && webpack --progress --colors --watch --config ./webpack.dev.config.js",
-    "start": "webpack-dev-server --inline --progress --compress --devtool eval --content-base build/ --open",
+    "start": "webpack-dev-server --config ./webpack.dev.config.js --open",
     "profile": "node npm-scripts/before-build.script.js && webpack --colors --profile --display-modules",
     "dll": "node npm-scripts/before-build-dll.script.js && webpack --progress --colors --config ./webpack-dll.config.js",
     "analyse": "webpack --json > ./build/stats.json && webpack-bundle-analyzer --port 8989 ./build/stats.json",

webpack-config/output.config.js

@@ -1,7 +1,7 @@
 var dirVars = require('./base/dir-vars.config.js');
 module.exports = {
   path: dirVars.buildDir,
-  publicPath: '../../',
+  publicPath: '/',
   filename: '[name]/entry.js',    // [name]表示entry每一项中的key，用以批量指定生成后文件的名称
   chunkFilename: '[id].bundle.js',
 };

webpack.dev.config.js

@@ -12,4 +12,14 @@ module.exports = {
   eslint: require('./webpack-config/vendor/eslint.config.js'),
 
   postcss: require('./webpack-config/vendor/postcss.config.js'),
+
+  devServer: {
+    contentBase: './build/',
+    host: 'localhost',
+    port: 9090, // 默认8080
+    inline: true, // 可以监控js变化
+    // hot: true, // 热启动
+    compress: true,
+    watchContentBase: true,
+  },
 };