前提条件： 手机和电脑在一个局域网。（用手机给电脑开热点，都连校园网也行）

一、vue-cli 3.0以下的版本

(1) 在项目路径下，通过npm run dev启动项目,打开http://localhost:8080/#/

(2) 查看电脑的ip地址，并替换掉localhost

① 打开黑窗口，输入ipconfig，找到 

②       

问题：使用webpack构建项目时，只能用localhost无法用本机IP访问项目的问题

解决方法：参考链接 https://blog.csdn.net/qappleh/article/details/80987816

your-project/package.json：加入--host 0.0.0.0

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

(3) 搜索草料，打开草料二维码生成器网址，进入https://cli.im/text

  

(4) 将把替换成ip地址的网址复制到草料页面，生成二维码

(5) 使用微信扫描二维码

  

二、vue-cli 3.0及以上的版本

在项目目录下运行npm run serve，会给出以下提示，直接在手机上输入 http://192.168.1.4:8080/。