webpack-dev-server

因为要使用webpack-dev-server变量所以需要全局和局部安装。

打开浏览器,webpack-dev-server默认是iframe方式启动。

用inline方式的话需要配置client:

'common'  : ['./src/page/common/index.js','webpack-dev-server/client?http://locahost:8088/'],

然后在命令行:

webpack-dev-server --inline --port 8088

访问时如果出错,可能是没有在output配置publicPath(访问时的路径,相对于url)

publicPath:'/dist'

但是把client配置打包进了common模块,这样对于线上环境没什么用。所以需要配置环境变量:

var WEBPACK_ENV         = process.env.WEBPACK_ENV || 'dev';
if('dev' === WEBPACK_ENV){
config.entry.common.push('webpack-dev-server/client?http://localhost:8888/');
}

命令行简化启动方式需要在package.json里配置:

"scripts": {
"dev": "WEBPACK_ENV=dev webpack-dev-server --inline --port 8888",
"dev_win": "set WEBPACK_ENV=dev && webpack-dev-server --inline --port 8888",
"dist": "WEBPACK_ENV=online webpack -p",
"dist_win": "set WEBPACK_ENV=online && webpack -p"
},
 
 
 

转载于:https://www.cnblogs.com/xj198197/p/7309444.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值