webstorm是一款現在前端用的比較多的IDE,其優勢也比較多,這個大家在網上隨便搜搜就可以找到了。但是本人大部分的時間都是使用sublime text工作,最近由於工作上面比較常出現一些粗心大意的問題,所以我的leader就建議我去學習一下webstorm,畢竟webstorm怎么說也是IDE,跟文本編輯器有所不同的。
我們可以直接從官網的下載地址中去下載最新版:http://www.jetbrains.com/webstorm/
然后安裝完成之后選擇“license server",輸入:http://idea.imsxm.com/
由於webstorm默認的樣式比較的丑陋,而且背景色默認的是白色,這對於程序員來說是不太適合的(由於程序員長時間的使用電腦,所以不適合長時間的看背景色為白色,這樣對眼睛有害)。這個時候我們需要把背景顏色修改為深灰色,我們可以在
File->Settings->Colors & Fonts 中去設置皮膚的主題,一般情況我們默認設置為Monnokai這種,如圖所示,我們已經設置成功了
設置完主題皮膚之后我們正常還要把默認字體大小給改一改,默認的是12號字體,一般情況下我們需要設置成為16號字體。一般字型為source code pro,這種字型看起來比較符合博主個人的體驗,但是如果你不喜歡的話,也可以根據你自己的愛好進行自定義
在使用的過程中發現webstorm除了是一款IDE之外,還是有很多地方有亮點的,但是缺點也是有的,就拿作者比較熟悉的sublime text來說,sublime text支持項目的獨立環境,但是在webstrom中是沒有這個功能的,所以也就只能夠相當於打開文件夾的形式去重新打開項目
好了,主題和字體等等都已經配置完成了,之后如果沒有什么修改的話,我們一般就按照默認的配置去編寫代碼就行了,如果是要對特定的某些語言進行特殊的修改的話。我們可以在File->Settings->Colors & Fonts->對應的語言,中去修改
Ctrl+Shift+A 這個主要是搜索Settings中的各項配置中是否包含輸入的字段,同時除了支持這個功能還能夠支持對一些框架的相關功能的狀態查看,從而來開啟或者關閉某些功能。
Ctrl+Shift+Alt+N 查找方法名
Ctrl+N 查找類名(class)
Ctrl+Shift+N 查找文件名(File)
Ctrl+Alt+L 格式化代碼
Shift+F6 全文替換變量
一般在實際的項目中依照我以前的事件經驗來說,對於編程比較熟悉來說,查找文件這一塊是十分總要的,但是像調試之類的雖然說不上是雞肋,但是也是有一定的多余,因為本身前端就是依托的是瀏覽器環境,瀏覽器環境可以通過chrome debug tool來進行調試
上面已經提到了webstorm相比於其他的非IDE編輯器的同類型產品時,存在了很多優勢,其中包括模板定制,因為IDE可以將一些新的文件模板保存成為一種文件類型,以節省開發的時間,提交開發效率
我們可以使用快捷鍵Ctrl+Shift+A然后在對話框中輸入File Template
保存之后,下次新增文件的時候選擇CSS Demo就可以看到代碼塊在初始化的時候就已經寫好了
說到webstorm,調試功能應該是大家最津津樂道的一個特殊功能吧,但是其實在瀏覽器很是發達的今天,這種調試個人認為也沒有多大的意義了,瀏覽器能夠解決的問題,為啥非要使用IDE來解決呢,但是如果大家非要在webstorm中調試,可以看看這篇文章:http://blog.csdn.net/sujun10/article/details/54139560
為了方便大家的使用,在agileTheme大神原本搭建的基礎之上進行修改,成為了一個更加的適合程序員審美的皮膚,下載地址:http://files.cnblogs.com/files/st-leslie/setting.rar