webstorm预览html配置localhost为本机ip地址

harriszh 发布于2019-08-26 10:41 / 3033人阅读

摘要：默认打开的路径是当我们想在手机上看时这个地址显然不行，于是需要修改一下的配置，首先需要修改部分的红框框住部分，修改端口号，勾选后面部分然后是修改，点击号添加一个服务器，类别选择注意这里路径写所在文件夹的根目录，意思是如果你的是在，写的路

webstorm默认打开html的路径是 http://localhost:63342/...,当我们想在手机上看时这个地址显然不行，于是需要修改一下webstorm的配置，File->Settings->Build, Execution, Deployment;
首先需要修改debugger部分的红框框住部分，修改端口号，勾选后面部分：

然后是修改Deployment，点击+号添加一个服务器，类别选择Local or mounted folder

注意folder这里路径写所在文件夹的根目录，意思是如果你的html是在，写的路径就应该是，否则会找不到这个文件；
web server Url 就写本机ip地址加上你刚刚在debugger里配置的端口号；

然后是Mappings，local path同上面的folder，deployment path也是根路径，最后点击apply，就完成配置啦~

现在在webstorm里面选择用Chrome浏览器预览html已经是ip地址啦，这样就可以在手机上调试网页了！

云服务器 GPU云服务器如何查找本机ip地址 webrtc获取本机ip地址 php获取本机IP地址本机的ip地址php

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/106603.html

移动端真机调试实战经验

摘要：我个人比较推荐的方法是或者安卓手机的这种方式，比较简单方便快捷，然后根据具体的环境再选择更为合适的调试方法。本文首次发表于本人的个人博客：http://cherryblog.site/ ，欢迎大家到我的博客查看更多文章~ 前言在开发中前端免不了要进行移动端的开发，然而在电脑上看的样式和手机上还是有一定的差距的，因为手机上有顶部的状态栏和底部的菜单栏，特别是在qq内置浏览器中打开，差...

rainyang 2019-08-20 16:21 评论0 收藏0
前端开发：实时刷新（及时预览）工具小汇总，兼有gulp+browser-sync设置方法

摘要：打开您的命令行工具，进入到目录下，运行以下其中一条命令。将创建一个本地服务器并自动打开你的浏览器后访问地址，这一切都会在命令行工具里显示。自己写标签：实时刷新、免F5、 gulp + browser-sync 开门见山，首先讲明一下本文的定位吧：写这篇文章是因为自己在平时的学习中，一次次试验了很多的前端实时刷新工具，有顺手的，有蹩脚的，有简单的，有麻烦的，安装完又折腾，折腾完又卸...

villainhr 2019-08-21 10:47 评论0 收藏0
Vue-cli 3.5.1 + Webstorm 使用手机访问演示页面

摘要：使用手机访问演示页面如果使用和创建项目。后手机不能通过网络访问演示页面，原因是默认使用计算机本地连接的地址作为网络访问地址修改地址为要使用的无线网络地址就可以解决问题在之前的版本中可以修改目录内文件解决移除了文件后可尝试如下解决办法。 Vue-cli 3.5.1 + Webstorm 使用手机访问演示页面如果使用Webstorm和Vue-cli 3.5.1创建项目。npm run s...

CrazyCodes 2019-08-23 15:59 评论0 收藏0