一、JavaScript的調試
目前火狐和Chrome都具備調試JavaScript的功能,而且還是相當的強大。如果純粹是用瀏覽器來進行js調試的話,我比較喜歡用火狐。火狐可以安裝各種插件,真的是非常適合開發者。不過今天的主角并不是火狐,也不是Chrome,而是號稱最智能的JavaScript IDE:WebStorm。
WebStorm 是jetbrains公司旗下一款JavaScript 開發工具。被廣大中國JS開發者譽為“Web前端開發神器”、“最強大的HTML5編輯器”、“最智能的JavaScript IDE”等。與IntelliJ IDEA同源,繼承了IntelliJ IDEA強大的JS部分的功能。
其實WebStorm之所以支持調試JavaSccript,其實也是借助了Chrome,只要Chrome安裝JetBrains IDE Support插件,就可以直接在WebStorm里面進行調試了,效果那是非常的強大。
二、相關軟件安裝和配置安裝WebStorm
WebStorm官網:( https://www.jetbrains.com/webstorm/ ) 安裝Chrome和JetBrains IDE Support
JetBrains IDE Support的地址是:
https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji
不過一般都是被墻了,所以得翻墻去安裝插件了。
不懂的人可以直接安裝藍燈軟件,很方便翻墻。
配置端口(不是必須的)
如果你的端口剛好被占用,那么記得修改相應的端口Chrome和WebStorm都要修改
WebStorm對應修改的地方:
三、WebStorm調試JavaScriptWebStorm增加JavaScript調試選項
增加個TestJS的項目工程,直接選擇Empty Project類型即可
然后自己增加相應的html和js文件
在工程的右上角那里,點那個下尖符號,彈出 Edit Configurations
點綠色的+號,然后選擇JavaScript Debug
配置好相關路徑就可以了
2.運行調試效果
點擊那個綠色的甲蟲,就可以看到實際的調試效果了。這個時候Chrome會有下面的提示
會自動切換回WebStorm的調試界面
如果僅僅是這樣,那么跟其他瀏覽器的調試區別還是不是非常大,唯一的好處就是方便了,不用去切換。
下面的效果我覺得才是更加的調試效果,因為他可以直接把一些參數類型、數值結果直接顯示在代碼上面。
|
新聞熱點
疑難解答