webpack.config.js 只需要注意加大加粗的地方。

var webpack = require("webpack"); var HtmlWebpackPlugin = require('html-webpack-plugin');module.exports = {entry:{
　　　　　// 為每個入口都注入代理客戶端"index":[__dirname+'/src/js/index.js', 'webpack-dev-server/client?http://127.0.0.1:8080']? },output:{
　　　　　// 配合熱編譯服務器設置公共資源路徑，但編譯的時候需要移除。 publicPath : "http://127.0.0.1:8896/",path : __dirname + '/build/js',filename : '[name].js'},plugins:[new HtmlWebpackPlugin({
　　　　　　 // 不能寫為這種路徑，但編譯的時候需要寫成這種路徑// filename : __dirname + "/build/spa.html",
　　　　　　　// 由于熱編譯啟動的服務器，所以設置了publicPath，所以這里需要寫為相對路徑這樣才可以訪問localhost:port/spa.htmlfilename : "spa.html", template : __dirname + '/src/spa.html',//模板文件inject : 'head',hash : true,chunks : ["app"]})] }

?

package.json

{

"scripts": {"dev": "webpack-dev-server --host 127.0.0.1 --inline --hot --port 8896"}, },

?

命令行執行 npm run dev 測試

總結

以上是生活随笔為你收集整理的webpack 与 热编译webpack-dev-server的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。