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中修改代碼並保存,手機上刷新,就能看到修改后的效果。

 

注意電腦和手機必須是在同一局域網內。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM