参考:http://www.browsersync.cn/#install

首先全局安装BrowserSync : npm install -g browser-sync

其次在项目文件夹下运行: browser-sync start --server --files "css/*.css, *.html"

用以监听css和html文件,该文件夹下最好有index命名的html文件

运行完成后会跳出如下页面:

我的url是我自己已经设置好了的,显示的是电脑ip,地址栏默认其实是显示localhost的,如果将其改为自己的电脑端口号需要在设置里面进行设置。

将端口号3000更改一下,比如改成3001,就会跳到设置页面:

然后点击这里:

随后将想看的某个项目的地址输入:

将此地址栏发到手机上,只要是在同一个局域网内,就能在手机上查看此项目了

H5页面在手机上查看 使用手机浏览自己的web项目的更多相关文章

  1. 如何在手机上查看测试vue-cli构建的项目

    用vue-cli构建的项目有时候有些功能需要在手机上测试,比如上传图片的时候调用手机拍照功能或者查看相册的功能,这个时候就要用到手机测试了,那么如何在手机上查看测试vue-cli构建的项目?今天就写一 ...

  2. vue.js学习之 如何在手机上查看vue-cli构建的项目

    vue.js学习之 如何在手机上查看vue-cli构建的项目 一:找到config文件夹下的index.js文件,打开后,将host的值改为你本地的ip,保存后重启项目 二:输入ip和端口号打开项目 ...

  3. 便捷的方式在手机上查看Unity3D的Console Log(调试信息)

    Logs Viewer 功能描述 Using this tool you can easily check your editor console logs inside the game itsel ...

  4. 便捷的方式在手机上查看Unity3D的Console Log(调试信息 日志)

    Logs Viewer 功能描述 Using this tool you can easily check your editor console logs inside the game itsel ...

  5. H5页面中判断是安卓手机还是ios手机的方法;APP页面中嵌套的H5跳转到APP其他页面的方法。

    (一).在H5页面中,可以直接利用如下的方法来进行判断是安卓还是ios. var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linu ...

  6. 【Net】CEF浏览IISExpress运行Web项目

    前言 本文介绍在Winform桌面应用中,使用IISExpress做Host主机,启动.Net平台的Web项目. 浏览Web网页使用CEF开源组件. 准备 首先创建Winform项目WinFormII ...

  7. 怎么在手机上查看sqlite db

    在 从 百度应用 下载“SQLite编辑器(SQLite Editor)” 安装到手机上.前体是 手机已经Root(可以用360一键Root软件进行root).

  8. Web页面在手机上显示过大问题

    网上抄来了,自己也备忘下:增加<meta name="viewport" content="width=device-width, initial-scale=1. ...

  9. 微信H5页面嵌入百度地图---解决手机的webKit定位,ios系统对非https网站不提供支持问题

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=yGQt ...

随机推荐

  1. myEclipse环境下配置springMvc项目,进行简单的请求

    1."File-->New-->WebProject"新建一个web项目,命名为springMvc 2.将所需要用到的jar包复制到WEB-INF/lib路径下,然后右 ...

  2. java ThreadPoolExecutor 异常捕获

    一,创建一个线程池 其中: public void rejectedExecution(Runnable r, ThreadPoolExecutor executor) 饱和策略执行时的具体逻辑. p ...

  3. tomcat 启用https协议

    利用tomcat服务器配置https双向认证. 1.为服务器生成证书 打开cmd,进入jdk的bin目录下,输入下面的命令: keytool -genkey -v -alias tomcat -key ...

  4. 处理Codeigniter CLI模式无法读取通过Apache写入的文件缓存

    运行环境: Ubuntu 16.04 + PHP 5.6.40 + Apache/2.4.18 Codeigniter: 3.1.10 Codeigniter 3.1.10,缓存驱动方式是文件方式 遇 ...

  5. Java——对象

    1.2对象 1.2.1 对象的创建和使用 ①使用new + 构造器创建一个新的对象: ②使用“对象名.对象成员”的方式访问对象成员(包括属性和方法). public class Animal { pu ...

  6. Delphi中任务栏状态区的编程

    在Windows桌面的任务栏上有一个凹陷的区域,其中显示着系统时钟以及一些图标,这个长方形的区域便是Windows的任务栏状态区(taskbar status area).本文将介绍使用Borland ...

  7. LUOGU P3723 [AH2017/HNOI2017]礼物 (fft)

    传送门 解题思路 首先我们设变化量为\(r\),那么最终的答案就可以写成 : \[ ans=min(\sum\limits_{i=1}^n(a_i-b_i+r)^2) \] \[ ans=min(\s ...

  8. NX二次开发-算法篇-判断找到两个数组里不相同的对象

    NX9+VS2012 #include <uf.h> #include <uf_curve.h> #include <uf_modl.h> #include < ...

  9. The packaging for this project did not assign a file to the build artifact

    当进行mvn install时,遇到以下错误 The packaging for this project did not assign a file to the build artifact 在网 ...

  10. hexo next主题深度优化(六),使用hexo-neat插件压缩页面,大幅度提升页面性能和响应速度。

    文章目录 隆重感谢: 背景 开始 试水 成功的案例 安装插件,执行命令. hexo _config.yml文件添加 坑 跳过压缩文件的正确配置方式 压缩html时不要跳过.md文件 压缩html时不要 ...