渲染运行

配置脚本 package.js

 "dev":"webpack-dev-server --progress --config webpack.config.dev.js --open --hot"

##使用 npm run dev

控制台显示

> Webpack_Vue@1.0.0 dev /Users/amor/Desktop/Webpack_Vue
> webpack-dev-server --progress --config webpack.config.dev.js --open --hot
 10% building 4/4 modules 0 activeℹ ｢wdm｣: wait until bundle finished: /
ℹ ｢wdm｣: Hash: b0c5e11b0da53e37e7a4
Version: webpack 4.26.1
Time: 3629ms
Built at: 2018-11-28 15:21:39
     Asset       Size  Chunks             Chunk Names
 bundle.js    616 KiB    main  [emitted]  main
index.html  332 bytes          [emitted]
Entrypoint main = bundle.js
[0] multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js 52 bytes {main} [built]
[./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1.11 KiB {main} [built]
[./src/App.vue] 956 bytes {main} [built]
[./src/main.js] 101 bytes {main} [built]
    + 22 hidden modules
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./template.html] 480 bytes {0} [built]
    [./node_modules/lodash/lodash.js] 527 KiB {0} [built]
    [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 472 bytes {0} [built]
    [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 519 bytes {0} [built]
ℹ ｢wdm｣: Compiled successfully.

浏览器会自动打开。

当更改代码的时候，页面会自动的进行刷新。

代码Link