本文來(lái)自于:葡萄城控件技術(shù)團(tuán)隊(duì)博客
對(duì)于JavaScript程序員來(lái)說(shuō)散劫,目前有很多很棒的工具可供選擇稚机。本文將會(huì)討論10個(gè)優(yōu)秀的支持JavaScript,HTML5和CSS開(kāi)發(fā)获搏,并且可以使用Markdown進(jìn)行文檔編寫(xiě)的文本編輯器赖条。為什么使用編輯器而不是IDE進(jìn)行JavaScript編程?原因就是速度快常熙。
編輯器和IDE之間的本質(zhì)區(qū)別在于:IDE不但可以調(diào)試纬乍,并且可以對(duì)代碼進(jìn)行概要分析,IDE還支持應(yīng)用程序的生命周期管理(ALM)系統(tǒng)裸卫。我們?cè)谶@里討論的許多編輯器至少支持一個(gè)版本控制系統(tǒng)仿贬,通常是Git,現(xiàn)在IDE和編輯器之間的區(qū)別也越來(lái)越小墓贿。
在這10個(gè)JavaScript編輯器中茧泪,Sublime Text和Visual Studio Code是其中排名靠前的兩個(gè)。Sublime Text以其速度和方便的編輯功能多樣性出名募壕,Visual Studio Code的功能和速度與Sublime Text幾乎一致调炬。TextMate排名第三,雖然TextMate在兩年前排名第一舱馅,但其功能并沒(méi)有真正跟上發(fā)展缰泡。
你很可能在Sublime Text,Visual Studio Code和Brackets中找到自己喜歡的JavaScript編輯器,但是還有其它的編輯器工具Atom棘钞,BBEdit缠借,Komodo Edit,Notepad ++宜猜,Emacs和Vim等值得了解泼返。你可以根據(jù)現(xiàn)在的項(xiàng)目,選擇其中最為方便使用的編輯工具姨拥。
下面我們來(lái)了解所有的編輯器绅喉,文末會(huì)對(duì)它們進(jìn)行對(duì)比。
Sublime Text
如果你想要一個(gè)靈活叫乌、強(qiáng)大柴罐、可擴(kuò)展的文本編輯器,它能夠如閃電般快速運(yùn)行憨奸,并且支持切換到其它窗口進(jìn)行代碼檢查革屠、調(diào)試和部署,那么可以考慮使用Sublime Text排宰。
除了速度較快以外似芝,Sublime Text還有許多值得注意的優(yōu)勢(shì),它涵蓋了70多種文件類型板甘,其中包括JavaScript党瓮、HTML和CSS;?即時(shí)導(dǎo)航和即時(shí)項(xiàng)目切換;?多選項(xiàng)(一次進(jìn)行一系列更改),包括列選擇(一次選擇文件的一個(gè)矩形區(qū)域);?多窗口(使用你的所有顯示器窗口)和拆分窗口;?使用簡(jiǎn)單的JSON文件進(jìn)行完整的自定義;?基于Python的插件API;?一個(gè)統(tǒng)一的虾啦、可搜索的命令板麻诀。
對(duì)于使用其它編輯器的程序員來(lái)說(shuō),Sublime Text支持TextMate包(不包括命令)和Vi / Vim仿真傲醉。
Sublime Text是一個(gè)高度可配置和可擴(kuò)展的文本編輯器蝇闭。它包含超過(guò)50種語(yǔ)法,其中包括JavaScript硬毕,它可以使用Sublime軟件包和TextMate語(yǔ)法定義進(jìn)行擴(kuò)展呻引。可以能夠通過(guò)少量按鍵來(lái)安裝Babel(React)和TypeScript(Angular)的語(yǔ)法和支持吐咳。
Sublime Text支持多個(gè)窗口逻悠、拆分窗口,每個(gè)項(xiàng)目可以有多個(gè)工作區(qū)韭脊、多個(gè)視圖以及包含視圖的多個(gè)窗格童谒。當(dāng)想要整合、調(diào)試和測(cè)試空間時(shí)沪羔,使用所有的屏幕空間會(huì)變得相當(dāng)簡(jiǎn)單的饥伊。Sublime Text還支持所有內(nèi)容的自定義:顏色,文本字體,全局鍵綁定琅豆,制表符停止愉豺,特定文件的鍵綁定和代碼段,甚至語(yǔ)法突出顯示規(guī)則等茫因。Sublime Text的編碼文件默認(rèn)為JSON文件蚪拦,語(yǔ)言定義默認(rèn)是XML。
Sublime Text有一個(gè)活躍的用于創(chuàng)建和維護(hù)Sublime Text包和插件的社區(qū)冻押。Sublime Text缺少的許多功能驰贷,包括JSLint和JSHint接口,JsFormat翼雀,JsMinify饱苟,PrettyJSON和Git支持 ,都可以通過(guò)社區(qū)使用Package Installer來(lái)實(shí)現(xiàn)狼渊。
官網(wǎng)鏈接:http://www.sublimetext.com/
下載地址:http://www.sublimetext.com/3
Visual Studio Code
Visual Studio Code是一個(gè)的免費(fèi)的輕量級(jí)編輯器和IDE,它是Microsoft發(fā)布的类垦。它具有Visual Studio組件狈邑,能與開(kāi)源的Atom Electron shell混合使用。它對(duì)于使用C#進(jìn)行ASP.Net Core的開(kāi)發(fā)蚤认,提供了極好的支持米苹;同時(shí)它也通過(guò)TypeScript和JavaScript為Node.js的開(kāi)發(fā),提供了極好的支持砰琢。不同于Visual Studio僅在Windows上支持的慣例蘸嘶,Visual Studio Code也能在MacOS和Linux上運(yùn)行。
由于包含了TypeScript編譯器和Salsa引擎陪汽,Visual Studio Code具有非常好的JavaScript代碼完成功能训唱。Visual Studio Code會(huì)將JavaScript代碼發(fā)送到后臺(tái)的TypeScript編譯器來(lái)推斷類型并構(gòu)建符號(hào)表。你可以在屏幕圖像底部的框中看到hasOwnProperty方法的信息挚冤。
相同的符號(hào)表使得IntelliSense能夠在整個(gè)表達(dá)式的輸入過(guò)程中况增,為你提供出色的彈出式選項(xiàng)列表。你可以獲得以下功能:填入后自動(dòng)關(guān)閉训挡、自動(dòng)填寫(xiě)完成選項(xiàng)澳骤、鍵入后的自動(dòng)方法列表和方法中的自動(dòng)參數(shù)列表。你可以通過(guò)從DefinitelyTyped添加對(duì)d.ts文件的引用澜薄,來(lái)增強(qiáng)IntelliSense为肮。當(dāng)你識(shí)別常見(jiàn)問(wèn)題(例如使用Node.js內(nèi)置變量中的__dirname)時(shí),Visual Studio Code將為你提供這些功能肤京。
Visual Studio Code是一個(gè)免費(fèi)的輕量級(jí)編輯器和IDE颊艳,用于Node.js和ASP.Net?開(kāi)發(fā)。它結(jié)合了Microsoft技術(shù),例如TypeScript編譯器籽暇、Roslyn .Net編譯器和Atom使用的Electron shell温治。Visual Studio Code適用于Windows,MacOS和Linux平臺(tái)戒悠。
Visual Studio Code的Git支持非常好熬荆,使用起來(lái)很簡(jiǎn)單。Visual Studio Code調(diào)試器為Node.js和ASP.Net開(kāi)發(fā)提供了出色的調(diào)試體驗(yàn)绸狐。Visual Studio Code具有非常好的HTML卤恳,CSS搪哪,Less葬凳,Sass和JSON工具,這個(gè)工具是基于與Internet Explorer F12開(kāi)發(fā)人員工具相同的技術(shù)澡匪。此外符相,Visual Studio Code可以與外部任務(wù)運(yùn)行程序(如gulp和jake)進(jìn)行可定制的集成拆融。
Visual Studio Code有著強(qiáng)大的插件生態(tài)系統(tǒng),例如支持Angular和React啊终。推薦可以在使用JavaScript和TypeScript框架和庫(kù)構(gòu)建應(yīng)用程序時(shí)使用Visual Studio Code镜豹。
官網(wǎng)鏈接:https://code.visualstudio.com/
下載地址:https://code.visualstudio.com/Download
Brackets
Brackets是一個(gè)免費(fèi)的開(kāi)源編輯器,最初來(lái)自于Adobe蓝牲,旨在為JavaScript趟脂,HTML和CSS提供更好的工具以及相關(guān)的開(kāi)放式Web技術(shù)。Brackets本身是用JavaScript例衍,HTML和CSS編寫(xiě)的昔期。除了內(nèi)置功能外,Brackets還有一個(gè)擴(kuò)展管理器佛玄,用于擴(kuò)展前端開(kāi)發(fā)人員使用的許多語(yǔ)言和工具硼一。Brackets不像Sublime Text和TextMate那樣運(yùn)行的很快,但除了從網(wǎng)絡(luò)加載或更新程序內(nèi)容的暫停之外翎嫡,它仍然運(yùn)行的非城范快。
Brackets不僅對(duì)JavaScript惑申,CSS具伍,HTML和Node.js有著很好的支持,它還具有一些其它很棒的功能圈驼,例如與HTML ID相關(guān)的CSS在線編輯人芽。此外,Brackets有著一個(gè)簡(jiǎn)潔的UI界面和編輯時(shí)網(wǎng)頁(yè)的實(shí)時(shí)預(yù)覽绩脆。對(duì)于免費(fèi)的代碼編輯器來(lái)說(shuō)萤厅,Brackets是一個(gè)很好的選擇橄抹。
Brackets擴(kuò)展也是用JavaScript編寫(xiě)的,還可以調(diào)用Node.js模塊惕味。與大多數(shù)在選項(xiàng)卡中顯示打開(kāi)文件的編輯器不同的是楼誓,Brackets具有顯示在文件樹(shù)上方的工作文件列表。
Brackets的JavaScript自動(dòng)完成功能非常好名挥,自動(dòng)填寫(xiě)各類括號(hào)的結(jié)束括號(hào)疟羹,以及jQuery方法中鍵入$之后的關(guān)鍵字、變量和方法的自動(dòng)下拉菜單禀倔。Brackets可以控制Node.js的調(diào)試器榄融,并從菜單項(xiàng)中重新啟動(dòng)Node。Brackets可以很方便的添加附加功能的擴(kuò)展(例如TypeScript和JSX支持救湖,Bower集成和Git集成)愧杯。
快速編輯、快速保存文檔鞋既、快速打開(kāi)文件和實(shí)時(shí)預(yù)覽均有助于簡(jiǎn)化Web應(yīng)用程序編輯力九,讓你專注于編碼或設(shè)計(jì)。Brackets也有一些缺點(diǎn)涛救,例如一些Brackets擴(kuò)展很難配置畏邢,不像Emacs軟件包或Vim插件那樣容易。
官網(wǎng)鏈接:http://brackets.io/
下載地址:https://github.com/adobe/brackets/releases/download/release-1.9/Brackets.Release.1.9.msi
Atom
Atom 1.15.0是一款GitHub上的免費(fèi)的開(kāi)放源代碼检吆、可編程的編輯器,適用于Windows程储,MacOS和Linux平臺(tái)蹭沛,它與GitHub應(yīng)用程序集成在一起,擁有很多個(gè)可用的軟件包和主題章鲤。
Atom源代碼位于GitHub上摊灭,它是用CoffeeScript編寫(xiě)的,與Node.js集成在一起败徊。Atom是Chromium瀏覽器的一個(gè)特殊的存在帚呼,它被設(shè)計(jì)成一個(gè)文本編輯器而不是一個(gè)Web瀏覽器;?每個(gè)Atom窗口本質(zhì)上都是一個(gè)本地呈現(xiàn)的網(wǎng)頁(yè)。
當(dāng)Atom不自動(dòng)更新時(shí)皱蹦,性能是非常好的煤杀。它具有一些非常棒的功能,例如模糊搜索沪哺、快速項(xiàng)目搜索和替換沈自、多個(gè)光標(biāo)和選擇、多個(gè)窗格辜妓、代碼段枯途、代碼折疊以及導(dǎo)入TextMate語(yǔ)法和主題的功能忌怎。Atom可以安裝兩個(gè)命令行實(shí)用程序:Atom,用于從shell啟動(dòng)編輯器酪夷;APM榴啸,用于管理Atom的軟件包。
官網(wǎng)鏈接:https://atom.io/
下載地址:https://atom.io/download/windows_x64
Komodo Edit
Komodo Edit?是ActiveState的一個(gè)免費(fèi)的晚岭,縮小功能版本的Komodo IDE鸥印,它是一個(gè)很酷的多語(yǔ)言編輯器。
如果你喜歡Komodo IDE但是卻支付不起腥例,那么Komodo Edit會(huì)是你的一個(gè)好選擇辅甥。Komodo Edit不是一個(gè)IDE,所以你需要在編輯器外完成代碼控制燎竖。
它不提供實(shí)時(shí)代碼收集功能璃弄,如果你獨(dú)立開(kāi)發(fā),不與其他人合代碼构回,就沒(méi)有任何問(wèn)題夏块。它也不提供HTTP檢查器。Komodo Edit具有與Komodo IDE相同的編輯功能纤掸,但缺少代碼重構(gòu)脐供、調(diào)試、單元測(cè)試借跪、源代碼控制集成以及其他適合于IDE的功能政己。
在任何情況下,Komodo Edit可以免費(fèi)滿足你的JavaScript編輯需求掏愁,并為編輯HTML歇由,CSS,Python果港,Perl沦泌,Ruby,Tcl和其它編程提供標(biāo)記語(yǔ)言辛掠。
官網(wǎng)鏈接:https://www.activestate.com/komodo-ide/downloads/edit
下載地址:https://www.activestate.com/komodo-ide/downloads/edit
Notepad ++
Notepad ++是一個(gè)免費(fèi)的開(kāi)源Windows源代碼編輯器和記事本谢谦,非常適合于編輯JavaScript。它支持約50種編程和標(biāo)記語(yǔ)言萝衩。除了其多個(gè)文檔編輯窗口之外回挽,它還具有工作區(qū)樹(shù)視圖、功能列表選項(xiàng)卡和文檔映射選項(xiàng)卡欠气。它的加載時(shí)間足夠快厅各,性能足夠強(qiáng),不會(huì)讓你感到速度慢预柒。
使用語(yǔ)法著色和折疊功能队塘、可編輯功能(包括列模式編輯和正則表達(dá)式袁梗、支持搜索和替換)以及一定量的功能完成和參數(shù)提示功能,Notepad++可以輕松地成為JavaScript的首選代碼編輯器憔古。然而遮怜,它還不是全面的JavaScript編輯器,它還不能生成代碼鸿市,執(zhí)行諸如重構(gòu)的操作锯梁,并在大型項(xiàng)目中快速導(dǎo)航。
官網(wǎng)鏈接:https://notepad-plus-plus.org/
下載地址:https://notepad-plus-plus.org/download/v7.3.3.html
BBEdit
BBEdit 11.0.3是一個(gè)文本編輯器焰情,僅用于Mac的HTML陌凳,它支持約35種編程和標(biāo)記語(yǔ)言,社區(qū)版還通過(guò)BBEdit網(wǎng)站提供了對(duì)許多其它語(yǔ)言的支持内舟。許可版和社區(qū)版都有語(yǔ)法高亮合敦;許可版還有一定量的自動(dòng)完成功能,主要用于功能名稱验游、變量名稱充岛、少量的關(guān)鍵字和標(biāo)簽。許可版還能與Git耕蝉,Perforce和Subversion版本控制系統(tǒng)集成崔梗。
BBEdit 11是該產(chǎn)品的重大改寫(xiě),這個(gè)版本比以前更加快速垒在,并且還能夠很好地處理Ginormous文件蒜魄。它具有將選擇或查找結(jié)果復(fù)制到新緩沖區(qū)中的提取功能,以及剪切功能场躯。BBEdit可以編輯和運(yùn)行Perl权悟,Python,Ruby推盛,和Shell腳本,以及檢查Perl和Python腳本的語(yǔ)法谦铃。
BBEdit對(duì)HTML和Markdown的支持實(shí)際上比其對(duì)JavaScript支持更好耘成。你可以為BBEdit安裝三個(gè)命令行工具:一個(gè)用于編輯器,一個(gè)用于差異引擎驹闰,最后一個(gè)用于多媒體搜索瘪菌。
官網(wǎng)鏈接:http://www.barebones.com/products/bbedit/
下載地址:https://s3.amazonaws.com/BBSW-download/BBEdit_11.6.6.dmg
TextMate
TextMate曾經(jīng)主要用于在MacBook上編寫(xiě)Ruby on Rails,但是現(xiàn)在TextMate變得不那么突出了嘹朗,與此同時(shí)Sublime Text逐漸收到了歡迎师妙。
TextMate不是一個(gè)IDE,但是它卻提供了軟件包屹培、代碼段默穴、宏和范圍系統(tǒng)等語(yǔ)言特定的IDE都缺少的功能怔檩。TextMate現(xiàn)在提供了簡(jiǎn)單的JavaScript和jQuery的捆綁包,它們?yōu)榭焖偕蒍avaScript和jQuery代碼提供了一系列不錯(cuò)的工具蓄诽。要想具有類似于IDE的功能薛训,你可以使用TextMate的shell集成版本,但不要期待TextMate可以進(jìn)行代碼重構(gòu)仑氛、自動(dòng)單元或回歸測(cè)試乙埃。如果正確設(shè)置了Grunt,那么TextMate就可以自動(dòng)執(zhí)行JavaScript測(cè)試锯岖。
TextMate有一個(gè)捆綁包首選項(xiàng)標(biāo)簽介袜,從中可以下載并安裝其他捆綁包。捆綁源出吹,實(shí)際上是產(chǎn)品駐留在GitHub存儲(chǔ)庫(kù)中的源代碼遇伞。
官網(wǎng)鏈接:http://macromates.com/
下載地址:http://macromates.com/download
Emacs
Emacs及其衍生來(lái)自于自20世紀(jì)70年代初以來(lái)的MIT AI實(shí)驗(yàn)室。Emacs從作為T(mén)ECO文本編輯器的宏開(kāi)始趋箩,逐步發(fā)展獨(dú)立赃额。默認(rèn)安裝在MacOS上的Emacs是22.1.1版本,沒(méi)有GUI支持叫确。你可以輕松地安裝XEmacs跳芳,Aquamacs(MacOS的GUI)和更新的GNU Emacs版本。Emacs作為JavaScript編輯器竹勉,編輯JavaScript的默認(rèn)模式是在js包中飞盆,使用Emacs可以獲得更好的語(yǔ)法高亮和linting。
Emacs使用js2模式包次乓,并使用ac-js2自動(dòng)完成吓歇。在Emacs中,你可以使用串行模式獲取實(shí)時(shí)瀏覽器JavaScript票腰,HTML和CSS交互城看。
官網(wǎng)鏈接:https://emacsformacosx.com/
下載地址:https://emacsformacosx.com/emacs-builds/Emacs-25.2-universal.dmg
Vim(and variants)
Vi(visual interface)最初由Bill Joy為Unix撰寫(xiě),自1976年開(kāi)始杏慰,逐漸由Ed向Ex演變测柠。Vim是一個(gè)免費(fèi)的、開(kāi)源的缘滥、改進(jìn)版的Vi轰胁;默認(rèn)安裝在Mac OS X上的是7.3版本。
你可以輕松安裝Vim的更新版本朝扼,MacVim(MacOS的GUI)或任何適用于你的平臺(tái)的功能赃阀。Vim作為JavaScript編輯器,它的vim-plug readme文件中的建議是相當(dāng)好的擎颖。
官網(wǎng)鏈接:http://www.vim.org/
下載地址:http://www.vim.org/download.php
使用哪個(gè)編輯器榛斯,由你決定
無(wú)論你是專注于客戶端的JavaScript還是Node.js观游,都有多種選擇。
如果你正在尋找一個(gè)功能強(qiáng)大肖抱,速度很快的JavaScript編程文本編輯器备典,并支持很多其它語(yǔ)言,可以選擇Sublime Text意述。
如果你想要一個(gè)免費(fèi)的提佣,快速的JavaScript編輯器,兼容IDE荤崇,并且對(duì)ASP.Net和C#支持得很好拌屏,Visual Studio Code是一個(gè)很好的選擇。
Brackets和Atom是兩個(gè)新的术荤、免費(fèi)的文本編輯器倚喂。Brackets是一款很接近于用于Node.js開(kāi)發(fā)IDE的編輯器,Atom可以與GitHub桌面客戶高度集成瓣戚。
在Windows上端圈,Notepad++是快速、有效并且免費(fèi)的子库。在MacOS上舱权,BBEdit是快速、很酷的仑嗅、免費(fèi)的限量版本宴倍,可用于版本控制集成,是一個(gè)HTML工具仓技。TextMate仍然是一個(gè)非常棒的編輯器鸵贬,具有快速、全功能脖捻、可擴(kuò)展的特點(diǎn)阔逼,但是開(kāi)發(fā)速度已經(jīng)很緩慢。
如果傾向于使用開(kāi)源腳本語(yǔ)言地沮,Komodo Edit是個(gè)不錯(cuò)的選擇颜价。如果喜歡自定義編輯器,Emacs或Vim可以滿足你的要求诉濒。
原文鏈接:http://www.infoworld.com/article/3195951/application-development/review-the-10-best-javascript-editors.html
轉(zhuǎn)載請(qǐng)注明出自:葡萄城控件
關(guān)于葡萄城
葡萄城是全球控件行業(yè)領(lǐng)導(dǎo)者,世界領(lǐng)先的企業(yè)應(yīng)用定制工具夕春、企業(yè)報(bào)表和商業(yè)智能解決方案提供商未荒,為超過(guò)75%的全球財(cái)富500強(qiáng)企業(yè)提供服務(wù)。