server >
index
<html>
<body>
<script type="text/javascript" src="bundle.js"></script>
</body>
</html>
main.js
document.write('<h1>Hello World!!!</h1>');
package.json
{
"name": "webpack-server",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"start": "webpack-dev-server"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0",
"webpack-dev-server": "^3.2.1"
}
}
webpack.config.js
module.exports = {
devtool: 'eval-source-map',
entry: './main.js',
output: {
filename: 'bundle.js'
},
devServer: {
historyApiFallback: true,
contentBase: "./",
quiet: false, //控制台中不输出打包的信息
noInfo: false,
hot: true, //开启热点
inline: true, //开启页面自动刷新
lazy: false, //不启动懒加载
progress: true, //显示打包的进度
watchOptions: {
aggregateTimeout: 300
},
port: '8080', //设置端口号
//其实很简单的，只要配置这个参数就可以了
proxy: {
'/hy-api': {
target: 'http://192.168.1.14:8080',
}
}
}
};