vue项目局域网前后端接口对接相关设置

场景： 项目开发中，当前没有服务器，或感觉每次部署包麻烦的，可以本地调试。
项目：vue + webpack 内网环境下

第一步 ： 防火墙入站规则

电脑 左下角搜索 防火墙 

点击高级设置

点击入站规则 右键新增

选择TCP端口 下一页

写入你的前端web服务的端口 如果省事直接所有端口

下一步

再下一步

为你本条规则起个名字 ，和已存在的不重复即可 方便管理

第二步 项目设置

      查看本机ip   win + r   输入cmd   打开后 输入ipconfig ,  查看  IPv4 地址。
      vue项目中
   1.  config /dev.env.js 文件中
        TARGET值， 写入ip地址  例如： http://11.111.11.11:8080/port 
       index.js文件中 dev:{  } 配置中设置代理

    proxyTable: {
      '/port': {
        target: '后台接口ip:端口',
        changeOrigin: true,
        pathRewrite: {
          '^/port': ''
        }
      }
    },
    host: '自己本机的ip', // 
    port: 8080, 和上面一致

接下来启动服务， 使用ip在chrome浏览器中，发现还是无法访问。
百度发现： 是webpack 固定了本地前端服务的ip 只能local host和127.
进入package.json中
webpack-dev-server后面，加一句–host 0.0.0.0

"scripts": {
"dev": "webpack-dev-server --host 0.0.0.0 --inline --progress --config build/webpack.dev.conf.js",

再次启动，可以了。

后台开发接口，也是同样。这样局域网下的电脑就可以项目访问本地服务，这样不用部署也可以和线上同样的效果。