vue-cli3.0启动项目,在局域网内其他电脑通过自己ip访问

Posted -roc

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue-cli3.0启动项目,在局域网内其他电脑通过自己ip访问相关的知识,希望对你有一定的参考价值。

最近一直在使用vue-cli3.0做项目,

package.json中配置后,自启动项目,也就没留意过小黑窗,

"scripts": {
    "serve": "vue-cli-service serve --open",  // 自启动浏览器
    "build": "vue-cli-service build"
  },

启动后发现,如下,不仅有Local,还有 Network

 App running at:
  - Local:   http://localhost:8080
  - Network: http://110.119.114.66:8080   // 当然ip是随意的

  Note that the development build is not optimized.
  To create a production build, run npm run build.

然后,借python大佬的电脑的一用,尝试连接两台电脑,使用下这个 Network,

步骤如下

1、两台电脑连接在同一网段(同一手机无线下即可)
2、连接两台电脑,相互ping下
    如 我的ip 110.119.114.66
        大佬的 110.119.114.88

    Win+R  --  cmd -- 下,
    相互ping,如 我ping大佬的
    
    ping 110.119.114.88  ( 只要不报超时之类的,就算成功 )

3、配置我的vue项目
    vue.config.js 中
    devServer: {
       // 由之前的 ‘localhost‘改为如下,端口默认8080
        host:"0.0.0.0",   
    }   

4、启动项目
    npm run serve ( 如果你没改过scripts ,就是这个启动命名 )

5、启动成功后,大佬在自己电脑访问  110.119.114.66:8080

即可

期间遇到写小问题:

大佬连接不到我的,大佬说是防火墙问题,处理了下:

详见  https://www.jb51.net/os/win10/300048.html

回显请求者2个,我不知道什么时候给关闭了

 

然后,在    控制面板系统和安全Windows Defender 防火墙自定义设置,中把两个网络的防火墙都暂时关掉,

大佬那嘎达就可以正常访问了。

 

总结,两点:

1、配置 host:"0.0.0.0",   
2、暂时关闭防火墙

以上是关于vue-cli3.0启动项目,在局域网内其他电脑通过自己ip访问的主要内容,如果未能解决你的问题,请参考以下文章

局域网内,其他物理机PING不通我的VM虚拟机

同一个局域网内,为啥有其中一台电脑ping不通,其他的都PING得通?

WebStorm 将项目部署到 IIS

vue-cli3.0项目启动报错

vue-cli3.0项目启动报错

在Intellij上开发项目发布到tomcat时,同一个局域网内的其他机子访问不到自己电脑上tomcat中的项目,只能本机访问