webstorm实现手机预览页面

效果：在webstorm中开发页面，复制该页面在电脑中的浏览网址，发给手机，在手机上点击链接，可以直接访问本地开发的页面。并且，电脑上修改后保存，手机上刷新即可看到效果。

步骤：

1、webstorm菜单栏，点击 File ——> settings... ，选择 Debugger，然后按下图红框里的配置。

2、选择 Deployment，按照下图配置。

3、刚创建的 myTest 的第一个菜单 Connection ，按下图说明配置。

4、myTest 的第二个菜单 Mappings ，一般不用设置，打开看下，和 Connection 中的 Folder 设置一致就行。

5、点击设置面板右下角的 Apply ，然后点击 OK 关闭面板。

测试：在webstorm中编辑的页面 test.html，本地打开路径显示是 http://192.168.100.3:8080/test/page/test.html?_ijt=ruka0gbhvkrqree8sj0f2d25c3

复制这个地址，发送手机，在手机上打开，即可访问电脑上的 test.html 。webstorm中修改代码并保存，手机上刷新，就能看到修改后的效果。

注意：电脑和手机必须是在同一局域网内。

转载于:https://www.cnblogs.com/zy20160429/p/9117766.html

webstorm实现手机预览页面相关推荐

实现微信小程序预览文件，预览页面添加倒计时
项目场景: 提示:1.实现小程序预览doc.docx.xls.xlsx.ppt.pptx.pdf类型文件 2.进入页面展示文件内容.开始按钮,点击,按钮变为[(**s)]倒计时 3.倒计时结束后,此按 ...
微信公众号提示：该地址为ip地址,请使用域名访问网站。继续访问将转换成手机预览模式
最近搞微信公众号开发,把url配置到公众号后台后,结果每一次网页跳转,微信都会弹出拦截页面,提示:该地址为ip地址,请使用域名访问网站.继续访问将转换成手机预览模式.如下图所示: 产生这种现象的原因: ...
微信小程序解决请求服务器手机预览请求不到数据的方法
微信小程序解决请求服务器手机预览请求不到数据的方法微信小程序的文档中明确说明了所有的请求是必须使用https的,以没用过https,由于小程序,不得不接触到https,研究了好长时间把tomcat ...
webpack预览页面配置
应用场景:当我们配置了webpack自动打包工具后,通过 http://localhost:8080/ 访问到的是文件夹根目录,而没有直接打开html页面,如果要打开html页面需要在界面中点击指定的 ...
配置 html-webpack-plugin 生成预览页面||配置自动打包相关的参数
配置 html-webpack-plugin 生成预览页面 ① 运行 npm install html-webpack-plugin –D 命令,安装生成预览页面的插件 ② 修改 webpack.co ...
微信小程序手机预览不正常，打开手机调试后预览正常
今天,做一个新的小程序,在电脑端显示正常,手机预览的时候,接口和图片都不能正常显示,但是打开手机的调试功能,又可以正常了,郁闷之余,在网上搜索找到了相关解决方法是因为服务器的域名没有设置,如下图:然 ...
微信小程序开发工具能正常请求后台数据，手机预览请求失败
微信小程序开发工具能正常请求后台数据,手机预览请求失败问题描述微信开发者工具调试完想用手机预览效果,结果发现凡是后台请求都失败. 原因分析可能的原因有三个: 微信开发者工具详情里的本地设置,没有 ...
微信小程序在小米手机预览头部空白了
微信小程序在手机预览出现头部空白,代码查阅后,发现app.json里"navigationBarBackgroundColor": "black",的值不能写颜 ...
Android相机预览页面被压缩和拉伸问题
最近公司要求在原有的项目中添加一个扫码登录的功能,在调试好相机之后,发现相机返回到Surfaceview页面上的预览图片,与我们现实中物品的比例并不相同,在一块正方形的Surfaceview中,预览界 ...

webstorm实现手机预览页面

webstorm实现手机预览页面相关推荐

最新文章

热门文章