Sublime Text 2 is een krachtige teksteditor, populair vanwege zijn beschikbaarheid op meerdere platforms en zijn talent voor het gebruik van reeds bestaande TextMate-functies. Combineer Sublieme Tekst 2 met Google's nieuwe Dart-taal, en power-coders kunnen erg blij zijn.
Opmerking van de uitgever: Sinds dit artikel voor het eerst werd gepubliceerd, is het verouderd. Er is nu een veel betere workflow voor het gebruik van Dart in Sublime Text 2, die Timothy Armstrong in deze video uitlegt:
Het originele artikel wordt hieronder niet uitgegeven.
Om dit snel te laten verlopen, ga ik ervan uit dat je enige basiskennis hebt. U moet bekend zijn met het volgende voor deze tip:
.bash_profile
bestand via de Terminal, dan komt alles goed.Als je wat leesmateriaal nodig hebt, verwijs ik je naar het volgende:
We zullen de Dart Editor niet echt gebruiken (het punt van deze tutorial is immers om Sublime Text for Dart-ontwikkeling te gebruiken), maar de download bevat de Dart SDK, wat echt is wat we zoeken. Zelfs als je een hardcore Sublime Text 2-fanaat bent, is het nog steeds geen slecht idee om de "officiële" Dart Editor geïnstalleerd en handig te hebben.
Op de officiële Dart-site kun je de Dart Editor downloaden via de volgende link:
http://www.dartlang.org/docs/getting-started/editor/
Onder "Stap 1" van die pagina vindt u een koppeling naar een ZIP-bestand met de Dart-editors. Het is ongeveer 70-100 MB, afhankelijk van je besturingssysteem, dus het is geen erg zware download. Maar begin ermee!
De Dart Editor is gebaseerd op Eclipse, dus als je dat hebt gebruikt, ben je meteen thuis met de Dart Editor. Ik zal niet in details treden over het gebruik ervan in deze tutorial, maar voel je vrij om ermee te spelen. De Activetuts + inleidende Dart-zelfstudie (momenteel exclusief beschikbaar via Facebook) neemt je mee door het basisgebruik van de Dart Editor.
Merk op dat als je de Dart Editor niet wilt installeren, je gewoon de Dark SDK voor je OS kunt downloaden op deze URL (het is slechts 2 of 3 MB):
http://www.dartlang.org/docs/getting-started/sdk/index.html
als jij niet doen een 64-bits Linux-installatie hebt, kunt u deze stap overslaan. (Ja, dat geldt ook voor u, Windows- en Mac-gebruikers; scrol omlaag voor uw instructies.)
als jij zijn op een 64-bits Linux-installatie moet je een 32-bits bibliotheek installeren om de Dart-compiler uit te voeren, zelfs als je de 64-bits dart-editor hebt gedownload. Ik ben in geen geval een Linux-goeroe, maar dit werkte voor mij, op mijn Ubuntu 11-installatie.
Ga naar het Software Center en zoek naar "lib32stdc ++ 6" of "GNU Standard C ++ Library 32 bit". Installeer het. Je kunt doorgaan met de volgende paar stappen terwijl het wordt geïnstalleerd - zorg er alleen voor dat deze bibliotheek is geïnstalleerd voordat je het buildsysteem probeert uit te voeren.
Het TextMate-taalbestand wordt hier gehost op Google Code (webgebaseerde weergave in de repository).
Dit is eigenlijk een onderdeel van een grotere TextMate-bundel (maar niet zoveel groter), maar we zijn alleen geïnteresseerd in de taalgrammatica.
Voordat we dat bestand pakken, maakt u een locatie om ervoor te zorgen dat het op uw systeem leeft. U moet een map met de naam maken pijl
op de volgende locatie, afhankelijk van uw besturingssysteem:
~ / Bibliotheek / Application Support / Sublime Text 2 / Packages / Dart
C: \ Users \ Administrator \ AppData \ Roaming \ Sublime Text 2 \ Packages \ Dart
~ / .Config / sublieme-text-2 / Arrangementen / Dart
Open vervolgens uw opdrachtregelinterface en ga naar de binnenkant van de nieuw gecreëerde pijl
map.
Subversion maakt het niet gemakkelijk om één bestand uit te checken, maar we kunnen een enkel bestand exporteren. Voer deze opdracht in:
svn export http://dart.googlecode.com/svn/branches/bleeding_edge/dart/tools/utils/textmate/Dart.tmbundle/Syntaxes/Dart.tmTaal
Na een moment zou je de Dart.tmLanguage
bestand in uw Dart-map.
Ga je gang en probeer het uit (mogelijk moet je Sublime-tekst opnieuw starten). Open een Dart-bestand en bekijk de kleurrijke syntaxis:
frogc
Uitvoerbaarfrogc
is de Dart-naar-JavaScript-compiler. Het is een opdrachtregelprogramma, maar het is gelukkig gemakkelijk te gebruiken. We zullen het later in een Sublime Build-systeem gebruiken om ons Dart-bestand (en) in JavaScript te veranderen, dus we hoeven het zelfs niet op de opdrachtregel te gebruiken..
Om het Build-systeem te maken, hebben we het pad naar ons nodig frogc
uitvoerbaar. Dit is gedownload met de Dart SDK (die je hebt gedownload met de Dart Editor of alleen). Het zal worden gevonden op dart-sdk / bin / frogc
. "dart-sdk" zal zijn waar je de SDK zelf hebt gedownload en uitgepakt, of net binnen de kern hebt genest pijl
map die ook de toepassing Dart Editor bevat, waar u deze hebt geplaatst.
We hebben een pad-line-compatibel pad naar frogc nodig. Op Mac OS, kunt u dit doen:
Open een Terminal-venster en sleep frogc erin. Het venster bevat de tekst van het pad van het bestand dat u hebt laten vallen.
Voor ramen:
Klik in de adresbalk van het venster. Het moet een gewoon tekstpad voor de map worden, dat u vervolgens kunt kopiëren. Je moet aan het einde "\ frogc.bat" toevoegen om het pad naar frogc te krijgen, niet alleen de map bin.
Als je Linux gebruikt, weet je waarschijnlijk al hoe dit moet.
Zorg ervoor dat het pad absoluut is en direct beschikbaar is. Plaats het op uw klembord of in een krastekstbestand voor de volgende stap.
Om dit taalpakket te maken werkelijk handig, we zouden een Build-systeem moeten opzetten, waarmee we bestanden kunnen uitvoeren via een shell-build-opdracht.
Kies in Sublime-tekst de Hulpmiddelen> Systeem bouwen> Nieuwbouwsysteem ... menu. Je krijgt een nieuw bestand te zien met de volgende standaard inhoud:
"cmd": ["make"]
Dit is slechts een JSON-object dat een zeer eenvoudige build-opdracht beschrijft. We voegen hier nog veel meer aan toe om het nuttig te maken voor Dart-ontwikkeling.
Met dat pad dat je hebt bepaald in de laatste stap die beschikbaar is, kunnen we onze subliem-build
het dossier.
Als u Mac of Linux gebruikt, wijzigt u de inhoud van het bestand naar:
"cmd": ["/ Applications / dart / dart-sdk / bin / frogc", "$ file"], "file_regex": "^ (. + \\. dart): (\\ d +): (\ \ d +):. + \\ [0m (. +) $ "," selector ":" source.dart "
Het bovenstaande is wat ik heb op mijn Mac-systeem. Waar staat / Applications / dart / dart-sdk / bin / frogc
, voeg je eigen frogc-pad toe.
Als u Windows gebruikt, ziet het bestand er ongeveer hetzelfde uit, maar moet u de "cmd
"regel naar:
"cmd": ["cmd", "/ C", "C: \\ hier invoegen \\ frogc.bat", "$ bestand"], "file_regex": "^ (. + \\. dart) : (\\ d +): (\\ d +):. + \\ [0m (. +) $ "," selector ":" source.dart "
Om in het kort uit te leggen wat dit doet, de cmd
eigenschap is in feite precies wat moet worden uitgevoerd op de opdrachtregel. frogc
is eenvoudig te gebruiken: voer gewoon de opdracht in en voer het een bestand in. De $ file
een deel van die regel is een variabele die automatisch wordt uitgebreid naar de pagina van het huidige bestand.
In Windows zijn dingen standaard een beetje funkierer (althans in dit scenario, dat is geen graaf bij Microsoft, ik zweer het!). Wat we hebben, voert de Windows-opdrachtregel uit (cmd
) met de parameter "houd het terminalvenster niet op"/ C
, hoewel zelfs de "houd het terminalvenster op" / K
parameter toont het ook niet) en voer frogc.bat uit, waarbij het het volledige pad doorgeeft. Dit is de snelle manier om het werkend te krijgen, maar het lijkt fouten te veroorzaken in de huidige build. Dit is waarschijnlijk een tijdelijk probleem, want ten tijde van dit schrijven worden deze fouten geproduceerd met de standaard SDK en niet met de nieuwste SDK. Zie de volgende stap voor een alternatieve route.
De file_regex
regel is voor foutrapportage doeleinden. Als een regel in de uitvoer van de opdracht overeenkomt met dit reguliere expressiepatroon, wordt deze herkend als een fout en wordt er op gedrukt F4 zal ze voor u markeren in het uitvoerpaneel.
Helaas gebruikt frogc tekst-stijlcodes om delen van het foutbericht een andere kleur en / of vet te maken. Wanneer deze worden doorgegeven aan Sublime-tekst, worden deze stijlcodes gepresenteerd als normale tekst, dus de uitvoer kan een beetje moeilijk te lezen zijn, met [0m
en soortgelijke codes doorspekt onder de voor mensen leesbare tekst. Ik ben me er helaas niet bewust van.
De laatste regel, keuzeschakelaar
, specificeert de scope waarin dit Build-systeem zou moeten plaatsvinden. Met deze set naar source.dart
, Dartbestanden moeten automatisch dit buildsysteem kiezen. Sublime Text 2 weet dat een ".dart" -bestand een, nou ja, een Dart-bestand is dankzij de taalgrammatica die we hebben geïnstalleerd.
Sla dit bestand op als Dart-frogc.sublime-build
in [Sublieme gegevens] / Pakketten / Gebruiker / Dart /
Om de bovengenoemde fouten in Windows te voorkomen en uw buildsysteem meer in overeenstemming te brengen met de Mac- en Linux-versies, kunnen we de map dart-sdk bin toevoegen aan de Windows-omgeving, zodat Sublime Text daar naar frogc zoekt.
Als u het pad wilt toevoegen, klikt u op Start, klikt u met de rechtermuisknop op Computer en selecteert u Eigenschappen. (Alternatief: Configuratiescherm> Systeem en beveiliging> Systeem.) Klik op 'Geavanceerde systeeminstellingen' en vervolgens op 'Omgevingsvariabelen'.
Zoek nu de variabele "path" in Gebruikersvariabelen of Systeemvariabelen (deze werkt met een van beide). Als het bestand niet bestaat, kunt u op Nieuw klikken om het te maken, maar als dit wel het geval is, kunt u op Nieuw klikken om het te overschrijven, dus wees voorzichtig.
Voeg het juiste pad toe aan het einde van wat er al is, gebruik een puntkomma om het te scheiden van al het andere. Het is niet nodig om te scheuren of spaties te vervangen door onderstrepingstekens of iets dergelijks. De mijne ziet eruit als:
C: \ Windows \ system32; C: \ Windows, C: \ Windows \ System32 \ Wbem; C: \ Users \ Administrator \ Downloads \ dart-win32-latest \ dart-sdk \ bin
(Schuif het bovenstaande vakje naar rechts.)
Dat laat je vluchten frogc c: \ whatever \ source.dart
vanuit het opdrachtvenster, maar het werkt nog steeds niet binnen Sublieme Tekst 2. Om een bepaalde reden, ST2 op Windows vereist dat je de bestandsextensie opgeeft in je build systeembestand, zoals zo:
"cmd": ["frogc.bat", "$ file"]
Op dit moment zou u een bruikbaar build-systeem op Windows moeten hebben dat minder snel breekt.
Ga je gang en probeer ons nieuwe Build-systeem uit. Open een Dart-bestand en druk op F7 of Controle-B (op de Mac, Command-B). "B" voor Build.
Je zou moeten zien dat het uitvoerpaneel onderaan opengaat, en als de Dart foutloos is, zul je het gewoon zien [Afgewerkt]
.
Als je fouten hebt, krijg je veel meer complexe uitvoer. Bijvoorbeeld:
Wanneer dit gebeurt, druk op F4 om vooruit te gaan door de verschillende foutlijnen, en Shift-F4 om achteruit te gaan. De foutlijn wordt gemarkeerd in het uitvoerpaneel en uw cursor wordt geplaatst op de regel en de kolom die worden geïdentificeerd door de fout.
Er kunnen mogelijk veel nuttige fragmenten aan een Dart-bundel worden toegevoegd. Laat me beginnen met het toevoegen van een fragment dat een nieuwe methode maakt.
Kies in het sublieme tekstmenu Hulpmiddelen> Nieuw fragment ... U krijgt opnieuw een standaardbestand aangeboden, deze in XML-indeling. Verander de inhoud naar:
methode source.dart
Voel je vrij om de inhoud van de te wijzigen
knooppunt van methode
naar iets anders dat je nuttiger vindt. Dit is wat u typt voordat u op Tab drukt om het fragment te krijgen.
Sla het bestand op als method.sublime-fragment
(de extensie is cruciaal, de basisnaam is wat uw fragment zal weergeven zoals in de menu's), op de volgende locatie ten opzichte van uw Sublime Text 2 Packages-map:
/Dart/method.sublime-snippet
U zou de map "Dart" al moeten hebben van de installatie van het taalgrammaticabestand.
Probeer nu uw nieuwe fragment uit (mogelijk moet u Sublime Text opnieuw starten, maar ik denk dat dit geen probleem meer is).
Typ in een Dart-bestand 'methode' (of wat je ook hebt opgegeven, als je je eigen tabbladtrigger hebt vervalst), druk op Tab en kijk hoe het wordt uitgebreid. U kunt door de verschillende registers bladeren, beginnend bij het retourneertype, vervolgens naar de methode naam en tenslotte tussen de haakjes als u argumenten wilt toevoegen. Het laatste tabblad plaatst u op de eerste regel van de methode.
Het leuke is dat als je het retourtype wijzigt van leegte
, je krijgt een automatisch return null
verklaring aan het einde van uw methode. Uiteraard wilt u dit aanpassen aan uw behoeften, maar hopelijk is het een functie die een beetje typen bespaart. De magie gebeurt in de logge tweede regel van het fragment; als je dit nog nooit eerder hebt gezien, dan is het enigszins moeilijk om bondig uit te leggen, maar het kijkt naar de inhoud van de eerste tabstop (het retourneertype) en of het iets anders is dan "leegte
", voegt het toe return null
. Het kan logisch zijn als u ooit reguliere expressies heeft gebruikt, met name met de substitutiesyntaxis van / Patroon / vervanging /
gevonden in Perl.
Het veld is wijd open voor het maken van tijdbesparende Dart-fragmenten. Je kunt je fragmenten in de reacties plaatsen.
En daar heb je het; gebruikers die een bepaalde teksteditor liever hebben dan wat dan ook, kunnen dit blijven doen, zelfs met deze nieuwe Dart-taal. Bedankt voor het lezen en ik hoop dat je onderweg iets hebt geleerd over de uitbreidbaarheid van Sublime Text 2.