JavaScript används för många olika typer av program idag. Oftast fungerar JavaScript med HTML5 och CSS för att bygga web front ends. Men JavaScript hjälper också till att bygga mobila applikationer, och det har hittat en viktig plats på baksidan i form av Nod.js servrar. Lyckligtvis, JavaScript utvecklingsverktyg – både redaktörer och IDEs—stiger för att möta de nya utmaningarna.
Varför använda en IDE istället för en redaktör? Den främsta anledningen är att en IDE kan felsöka och ibland profilera din kod., IDEs har också stöd för ALM-system, integrera med Git, GitHub, Mercurial, Subversion och Perforce för versionskontroll. Men när fler redaktörer lägger till krokar i dessa system blir ALM-stöd mindre av en differentiator.
Eclipse 2018 med JavaScript utvecklingsverktyg
tillbaka i de gamla dagarna när Java Swing var ny och spännande, jag njöt av att använda Eclipse för Java-utveckling, men snart gick vidare till andra Java IDEs. För fem plus år sedan, när jag gjorde en Android-utveckling med Eclipse, hittade jag upplevelsen OK, men poky., När jag försökte använda Eclipse Luna med JSDT för JavaScript-utveckling i 2014 visade det ständigt falska positiva fel för giltig kod som passerade JSHint.
lyckligtvis har flera leverantörer och open source-projekt gått upp till plattan sedan dess. Eclipse 2018 med JavaScript utvecklingsverktyg har en anständig JavaScript editor och en Chrome-baserad debugger, men det vet inte Om TypeScript, som används av Angular, eller om ES6 och JSX filer, som används av React.
Eclipse har alltid haft en stor marknadsplats för plugins. För TypeScript, överväga gratis TypeScript 1.0.,0 plugin. För vinkel -, Maskin, och ES6, anser att de kommersiella Kantiga IDE (av CodeMix, tidigare Webclipse), och för att Reagera projekt med JSX filer försök med öppen källkod Maskin IDE. Om du lägger till mer än en måste du lösa tvisten om vilken som ska redigera TypeScript-filer, men det är inte en stor sak.
med lite ansträngning kan du göra Eclipse arbete med vinkel-och Reaktionsprojekt., Även om Eclipse inte stöder TypeScript, ES6 eller JSX-filer ur lådan, kan du lägga till en vinkel IDE och en TypeScript IDE för att fylla i luckorna.
CodeMix verktyg faktureras som att lägga Visual Studio kod smarts till Eclipse. Till skillnad från de flesta Eclipse plugins är Angular IDE av CodeMix inte gratis, men det har en 45-dagars gratis testversion. Med tanke på att Visual Studio koden är gratis, skulle jag överväga att innan du betalar för Angular IDE.
Kostnad: Gratis; vinkel IDE av CodeMix, $29 (personlig) eller $48 (kommersiell) per år. Plattform: Windows, MacOS och Linux.,
ActiveState Komodo IDE
Jag har varit användare och fan av Komodo IDE sedan den introducerades 2001. Även nyare produkter som Visual Studio Code och WebStorm har överträffat det i vissa områden, det är fortfarande en bra redaktör och IDE.
Komodo IDE tillhandahåller avancerad JavaScript-redigering, syntaxmarkering, navigering och felsökning, men det inkluderar inte JavaScript-kodkontroll. För det kan du alltid köra JSHint i ett skal.
Komodo stöder dussintals Programmerings-och markupspråk., Med sitt breda utbud av programmering och markup språkstöd, inklusive refactoring, felsökning och profilering, är Komodo IDE ett mycket bra val för end-to-end utveckling i öppen källkod.
Komodo har en kod refactoring modul för alla språk som den ger kod intelligens: PHP, Perl, Python, Ruby, Tcl, JavaScript och Nod.js. Tyvärr begränsar den” minst gemensamma nämnaren ” karaktären av detta tillvägagångssätt möjligheterna att byta namn på variabler och klassmedlemmar och att extrahera kod till en metod. Ändå är det några av de mest användbara Fallen.,
Komodo IDE har både kolumnredigering och flera val. Detta ger nära paritet med sublim Text och TextMate när det gäller massredigeringar. Så länge vi gör jämförelsen är Komodo mer av en IDE, medan sublim Text är mycket snabbare. Och så länge vi diskuterar prestanda har Komodos hastighet förbättrats märkbart jämfört med äldre versioner, i skärmritning, sökning och syntaxkontroll.
Komodo IDE har flera funktioner som de flesta konkurrerande produkter saknar. En är dess HTTP-inspektör, vilket är utmärkt för att felsöka Ajax callbacks., En annan är dess RX (regular expression, eller regex) verktygslåda, vilket är ett bra sätt att bygga och testa reguljära uttryck för JavaScript, Perl, PHP, Python och Ruby.
samarbete är en annan Komodo IDE differentiator—tänk på det som Google Docs för kod. Du kan skapa sessioner för grupper av filer, lägga till kontakter i sessioner som medarbetare, sedan arbeta tillsammans på samma filer samtidigt, med nära realtid synkronisering.
samarbete är inte en ersättning för källkodskontroll, men det är ett användbart tillägg., Komodo IDE integrerar källkodskontroll med CVS, Subversion, Perforce, Git, Mercurial och Bazaar. Endast de grundläggande versionskontrollåtgärderna stöds. Avancerade operationer, såsom förgrening, måste göras med hjälp av en separat källkod kontrollklient.
Även om Komodo inte har sin egen JavaScript-dokument formatter, drar den nytta av den bästa fria öppen källkod för detta ändamål. Ur lådan är standardformaten för JavaScript-filer JS Beautifier, men ytterligare nio alternativ finns tillgängliga via en rullgardinsmeny.,
Komodo IDE tillhandahåller avancerad JavaScript-redigering, syntaxmarkering och navigering, men inkluderar inte signifikant JavaScript-kodkontroll (kör JSHint för det). Komodo stöder dussintals Programmerings-och markupspråk, med betoning på Perl, Python, PHP, Ruby, TCL och XSLT, och det inkluderar felsökning, refactoring, källkod styrintegration och enhetstestning.
Komodo IDE stöder felsökning av JavaScript på klientsidan i Chrome, och det kan felsöka nod.js både lokalt och på distans., Det debuterar också Perl, Python, PHP, Ruby, TCL och XSLT.
Komodo IDE har en dom-tittare som låter dig visa XML-och HTML-dokument som hopfällbara träd. Det låter dig också göra XPath sökningar för att filtrera trädet.
Komodos kodprofilering och enhetstestmoduler stöder inte JavaScript. Men JavaScript och Nod.js stöds båda av Komodos kod Intelligence modul, som implementerar kodbläddring, automatisk komplettering och calltips.
Komodo IDE kan publicera grupper av filer via FTP, SFTP, FTP eller SCP., Komodo kan också synkronisera filer och upptäcka potentiella publiceringskonflikter som kan få dig att skriva över andras ändringar.
Sammantaget är Komodo en bra men inte bra JavaScript IDE, och en bra men inte bra JavaScript editor. Det kan dock väl tjäna dina behov, speciellt om du också arbetar med Perl, Python, PHP, Ruby, tcl eller XSLT.
kostnad: $295, plus $87 per år för uppgraderingar och support. Plattform: Windows (7 eller högre), MacOS (10.9 eller senare), Linux.,
Apache NetBeans
NetBeans har mycket bra stöd för JavaScript, HTML5 och CSS3 i webbprojekt, och det stöder Cordova / PhoneGap ramverket för att bygga JavaScript-baserade mobila applikationer. NetBeans är inte den snabbaste IDE på blocket, men det är en av de mer kompletta. Och självklart är priset rätt: NetBeans är tillgängligt gratis under en Open source-licens.
NetBeans JavaScript-redigeraren ger syntaxmarkering, automatisk komplettering och kodvikning, ungefär som du förväntar dig., JavaScript-redigeringsfunktionerna fungerar också för JavaScript-kod inbäddad i PHP, JSP och HTML-filer. jQuery stöd bakas i redaktören. NetBeans 8.2 har nytt eller förbättrat stöd för Node.js och Snabb, Gulp, Grymta, AngularJS, Knockout.JS, Jade, mocka och selen.
kodanalys körs i bakgrunden när du redigerar, vilket ger varningar och tips. Felsökning fungerar i den inbäddade WebKit-webbläsaren och i Chrome med NetBeans-kontakten installerad. Debugger kan ställa in DOM, linje, händelse, och XMLHttpRequest brytpunkter, och det kommer att visa variabler, klockor och samtal stack., Ett integrerat webbläsarloggfönster visar webbläsarundantag, fel och varningar.
NetBeans kan konfigurera och utföra enhetstestning med jstestdriver, en JAR-fil (Java archive) som du kan ladda ner gratis. Felsökning av enhetstester aktiveras automatiskt om du anger Chrome med NetBeans-Kontakten som en av de JsTestDriver webbläsare när du konfigurerar JsTestDriver i fönstret Tjänster.,
När du felsöker ett webbprogram i Chrome med NetBeans-kontakten och redigerar CSS från Chrome Developer Tools, kommer ändringarna att fångas av NetBeans och sparas i CSS-filerna. Men om dina CSS-filer genererades från mindre eller Sass-formatmallar måste du manuellt uppdatera källarket eftersom CSS-filerna bara kompileras utdata.
i webbläsaren embedded WebKit och i Chrome med NetBeans-kontakten installerad kan du använda NetBeans Network monitor för att visa sökrubriker, svar och samtalsstackar för RESTKOMMUNIKATION., För WebSocket communications visas både rubriker och textramar. Sammantaget ger NetBeans en något bättre felsökningsupplevelse med Chrome än du får i Firefox med Firebug.
NetBeans integrerar källkodskontroll med Git, Subversion, Mercurial och CVS. Git-stödet förstärks av en grafisk Diff-tittare och av ett hyllsystem inom IDE. NetBeans färgkoder Git status för filer, kan du visa versionshistorik för varje fil, och visar revision och författare information för varje rad av versionsstyrda filer., NetBeans har liknande integrationer med Subversion, Mercurial, och CVS, men jag testade bara Git.
NetBeans integrerar problem spårning med Jira och Bugzilla. I fönstret NetBeans uppgift kan du söka efter uppgifter, spara sökningar, uppdatera uppgifter och lösa uppgifter i ditt registrerade uppgiftsförråd. NetBeans har också team server integration för webbplatser som använder Kenai infrastruktur.
så långt jag kan bestämma saknar NetBeans JavaScript-profilering, även om det kan profilera Java-program och EJB-moduler., Och medan NetBeans kan refaktorera Java och PHP, det kan inte refaktorera JavaScript.
totalt sett är NetBeans en anständig utmanare för klientsidan JavaScript, HTML5 och CSS3-utveckling, speciellt om du också gör Java, PHP eller C++ – utveckling på servern. Om du inte har budgeten för WebStorm och ogillar Microsoft, hittar du att NetBeans gör jobbet, så länge du inte har stor brådska.
Kostnad: Gratis. Plattform: Windows, Solaris, Mac Os, Linux.,
Microsoft Visual Studio 2017
i min fullständiga recension av Visual Studio 2017 diskuterade jag produkten som helhet, med bara några referenser till JavaScript. Jag lägger tonvikten här.
totalt sett tjänar Visual Studio 2017 Mycket bra som en JavaScript IDE, även om det är en bättre.Net IDE, och det är inte lika bra som WebStorm för JavaScript. Även om det också fungerar mycket bra som en JavaScript editor, Det är en bättre C # editor, och det är inte lika bra eller lika snabbt som sublim Text för JavaScript.,
som du kan se på skärmdumpen nedan gör Visual Studio 2017 ett bra jobb med JavaScript syntaxfärg och kodvikning. Det gör också ett bra jobb med JavaScript-kodnavigering: högerklicka på en funktion eller medlemsnamn, och du kan enkelt hoppa till definitionen eller hitta alla referenser. När du är klar med att titta på definitionen kan du trycka på bakåtpilen högst upp i gränssnittet för att gå tillbaka till var du var.
Du kan enkelt infoga utdrag och omge ditt val med lämplig kod, till exempel HTML eller URL-kodning av strängvariabler., Förutom JavaScript, HTML och CSS kan du redigera Markdown-filer och se den renderade Markdown, och du kan arbeta med TypeScript.
dessutom kan du naturligtvis kod i alla.NET språk, i C++, och i Python. Och som har varit fallet för Visual Studio under lång tid kan du arbeta med databaser direkt från IDE. Visual Studio är särskilt stark när man arbetar med SQL Server-databaser. Du kan komma undan med att använda Visual Studio istället för SQL Server Management Studio för de flesta databasoperationer du vill göra som utvecklare.,
Visual Studio 2017 stöder felsökning i ganska mycket vilken webbläsare du bryr dig om att kasta på den, inklusive webbläsare på mobila enheter och i emulatorer. Det har också två webbläsare av sig själv: den vanliga interna webbläsaren,som är (överraskning!) en version av Internet Explorer, och Sidgranskaren, som visar den renderade sidan tillsammans med alla källor och stilar., Även om Sidgranskaren gör mycket potentiellt tidskrävande, reverse-engineering saker att ställa sig upp för en sida, när du är i det kan du stanna där utan att behöva jonglera Visual Studio, webbläsaren och webbläsarens utvecklingsverktyg.
prestanda för Visual Studio 2017 är vanligtvis ganska bra om du ger det tillräckligt med minne och CPU-kraft, men det tenderar att kräva betydande resurser. Visual Studio 2017 har bra prestanda diagnostik för applikationer, men i stort sett är de inte allt som är användbart för vanlig JavaScript-kod, som vanligtvis körs djupt inne i en webbläsare., Visual Studio har specifik JavaScript-funktion timing, HTML UI responsiveness och JavaScript-minnesverktyg, men de gäller bara för JavaScript-baserade universella Windows-Plattformsprojekt, inte webbprojekt som råkar använda JavaScript.
Visual Studio 2017 har avancerat stöd för nod.JS, JavaScript ES6 och TypeScript med hjälp av Salsa analysmotorn. I ES6-läge kan den automatiskt ladda ner (från DefinitelyTyped)” typings ” för nod.js-paket du installerar med NPM, för att ge förbättrad IntelliSense., Det kan också automatiskt installera saknade npm-moduler, som ses längst ner till vänster.
Visual Studio 2017 innehåller Utmärkt nod.JS-applikationsredigering, IntelliSense, profilering, npm-integration, TypeScript-stöd, felsökning lokalt och på distans (Windows, MacOS, Linux) och felsökning på Azure Web Apps och Azure Cloud Services. Det har också stöd för CSS, HTML, JavaScript, TypeScript, CoffeeScript och mindre., Detta inkluderar att köra JSHint när du skriver, så att du kan minify JavaScript-filer från en snabbmeny, och automatiskt sammanställa CoffeeScript-filer på Spara, visar en sida vid sida förhandsgranskning av den genererade JavaScript.