一：用node配置（确保有node）
1. npm install http-server
2.cd 到指定目录
3.http-server
二：webpack配置
1.在config里的index.js中
function getIPAdress(){
var interfaces = require('os').networkInterfaces();
for(var devName in interfaces){
var iface = interfaces[devName];
for(var i=0;i<iface.length;i++){
var alias = iface[i];
if(alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal){
console.log(alias.address)
return alias.address;
}
}
}
}
2.在dev中host修改为如下
module.exports = {
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
// Various Dev Server settings
host: getIPAdress(), // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
三.gulp配置
1.
//获取当前ip
const getIPAdress = (function(){
var interfaces = require('os').networkInterfaces();
for(var devName in interfaces){
var iface = interfaces[devName];
for(var i=0;i<iface.length;i++){
var alias = iface[i];
if(alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal){
console.log(alias.address)
return alias.address;
}
}
}
})();
2.
// 服务器
gulp.task('server', function() {
var BASEURL = command=='watchapi'?'https://api.bianla.cn/':"https://dev.bianla.cn/";
var BASEURL2 = command=='watchapi'?'https://apibbs.bianla.cn/':"https://devbbs.bianla.cn/";
browser.server({
host: getIPAdress, //地址，可不写，不写的话，默认localhost
// port: 8000, //端口号，可不写，默认8000
root: `${pathObj.path}/test`, //当前项目主目录
livereload: true, //自动刷新
middleware:function(connect,opt){
return [proxy('/APIBIANLA',{
target:BASEURL,
changeOrigin:true,
pathRewrite:{"/APIBIANLA" :BASEURL}
}),
proxy('/APIBBSBIANLA',{
target:BASEURL2,
changeOrigin:true,
pathRewrite:{"/APIBBSBIANLA" :BASEURL2}
})]
}
});
});
3.
gulp.task('watch',['server'],()=>{
gulp.watch(`${pathObj.path}/dev/lib/*.js`,['js']);
gulp.watch([`${path.resolve("../")}/assets/js/*.js`,`${path.resolve("../")}/assets/styles/*.less`],['common']);
gulp.watch(`${pathObj.path}/dev/styles/*.less`,['less']);
gulp.watch([`${pathObj.path}/dev/*.html`,`${pathObj.path}/dev/template/**/*.html`],['html']);
});