web前端開發(fā)常用的編輯器都有哪些

這篇文章將為大家詳細講解有關(guān)web前端開發(fā)常用的編輯器都有哪些，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關(guān)知識有一定的了解。

工欲善其事必先利其器，每個前端工程師在做前端開發(fā)的時候，一定有幾款自己用著順手的編輯器。而一款好用且適合自己的前端開發(fā)編輯器，往往會達到事倍功半的效果。以下是小編為大家推薦的幾款編輯器，它們分別是HBuilder、WebStorm、Sublime Text、Visual Studio Code和wampServer。

1、HBuilder
　　

簡介：HBuilder是專為前端開發(fā)打造的開發(fā)工具，具有飛一樣的編碼、最全的語法庫和瀏覽器兼容數(shù)據(jù)、可以方便的制作手機APP、最保護眼睛的綠柔設計等特點。支持HTML、CSS、JS、PHP的快速開發(fā)。從開放注冊以來深受廣大前端朋友們的喜愛。
　　

優(yōu)點：
　　

因為是一款國產(chǎn)軟件，所以中文界面更容易迅速上手。HBuilder擁有完善的幫助文檔，諸如快捷鍵列表什么的，都能快速調(diào)出查詢；
　　

編碼速度飛快。它擁有完整的語法提示和代碼輸入法、代碼塊等，以及瀏覽器兼容性提示，大幅提升HTML、js、css的開發(fā)效率。內(nèi)嵌了emmet、jquery、bootstrap、angular、mui等常用框架的語法提示庫。支持less，sass等預編譯器。通過快捷鍵（alt+點擊）方便查找到js方法名、ID、CSS類名和鏈接的出處（定義），支持跨文件查找。HBuilder JSDoc+規(guī)范。編寫JSDoc有助于代碼可讀性的提升，還可生成API手冊（主要是框架）；
　　

強大的邊看邊寫功能。按下Ctrl P進入邊看邊改視圖，左邊保存右邊立即刷新。支持模擬手機端，方便進行UI調(diào)試。科學護眼。綠柔主題的特點是柔和、低對比度、強光可見、綠色感加強。對著這樣的界面寫一天代碼，感受要比對著太亮或太暗的界面舒服很多。
　　

缺點：

功能比文本編輯器多，執(zhí)行也自然會相對慢。編輯器滾動條的滑動有卡頓卡，略顯淡疼；
　　

比較吃內(nèi)存。HBuilder還自帶了可調(diào)試控制臺的瀏覽器，ide+瀏覽器都在這里，內(nèi)存占用肯定也少不了。資源消耗更多，但HBuilder可保證主流配置電腦流暢使用。
　　

2、WebStorm
　　

簡介：WebStorm 是jetbrains公司旗下一款JavaScript 開發(fā)工具。目前已經(jīng)被廣大中國JS開發(fā)者譽為“Web前端開發(fā)神器”、“最強大的HTML5編輯器”、“最智能的JavaScript IDE”等。與IntelliJ IDEA同源，繼承了IntelliJ IDEA強大的JS部分的功能。
　　

優(yōu)點：
　　

容易學習，新手也可以快速上手。不用講什么插件安裝，搞什么配置，直接上手才是王道；
　　

內(nèi)置功能強大。做為一款真正意義上的前端開發(fā)ide，它所集成的功能非常豐富，基本無須安裝插件。代碼定位能力。只需鼠標一點， 就能能輕松定位到變量/屬性/方法的定義處，開發(fā)非常有用；
　　

代碼和文件關(guān)聯(lián)能力。無論是修改文件名還是變量名（或者刪除），ws都會將變動同步到它們被使用到的地方，并且會彈出友好的警告提示。自帶git版本控，語法提示，nodeJS調(diào)試等功能，命令行功能，支持各種代碼檢測功能，支持各種代碼模板；
　　

強大的文件臨聽能力。輕松實現(xiàn)less、sass、coffescript自動編譯等。內(nèi)置服務器功能。不用配置煩雜的后臺環(huán)境，就可以簡單測試一些需要服務器配合的頁面。本地版本控制。在 WS 里所有的編輯都被存在本地，隨時可以還原到歷史版本（關(guān)鍵時候能救命）。
　　

缺點：
　　

吃內(nèi)存。如果項目或文件比較大的話，ws運行時間一長就可能出現(xiàn)各種狀況，卡頓甚至卡死也可能發(fā)生，但概率并不算高。如果用ws打開多個項目的話，內(nèi)存占用會大幅上升。盡管如此，也從來沒有造成過什么損失，最多只是重啟一下。
　　

3、Sublime Text
　　

簡介：它是一套跨平臺的文本編輯器，支持基于Python的插件，開發(fā)者是Jon Skinner。雖然Sublime誕生得早，但是至今仍有眾多的使用者。而且當前端開發(fā)需要在N個項目間頻繁切換時，Sublime Text就會派上大用場。
　　

優(yōu)點：
　　

不僅跨平臺，而且在所有平臺上看起來都很漂亮。很流暢，響應靈敏，很吸引眼球。支持多光標操作：它能讓你對文本中的多個地方同時做修改，你可以看到多個地方在你輸入的時候同時發(fā)生變化。重構(gòu)時用它很方便，比如修改一個變量名；
　　

擴展性很好，它使用了Python式的插件系統(tǒng)。這顯然是一個很大和活躍的社區(qū)，可以為它提供豐富的插件，這也意味著你可以在網(wǎng)上找的任何你想要的插件來集成你想要的功能。
　　

缺點：經(jīng)常發(fā)現(xiàn)手動安裝的插件會自動消失，原因是Sublime Text自動移除了。
　　

4、Visual Studio Code

簡介：Visual Studio Code中文版是微軟推出的帶 GUI 的代碼編輯器，軟件功能非常強大，界面簡潔明晰、操作方便快捷，設計得很人性化。軟件主要改進了文檔視圖，完善了對 Markdown的支持，新增PHP語法高亮。
　　

5、wampServer
　　

簡介：WampServer，是Windos Apache Mysql PHP集成安裝環(huán)境，即在window下的apache、php和mysql的服務器軟件。PHP擴展、Apache模塊，開啟/關(guān)閉鼠標點點就搞定，再也不用親自去修改配置文件了，WAMP它會去做。再也不用到處詢問php的安裝問題了，WAMP一切都搞定了。

關(guān)于web前端開發(fā)常用的編輯器都有哪些就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。