Hurtig Tips Konfigurere TextMate for Dart-koding

Dart er et ganske kult nytt språk som kan bety en endring i måten du skriver webapplikasjoner på. Google tilbyr en Eclipse-basert Dart Editor som gir et praktisk verktøy for å komme i gang. Men TextMate-brukere finner vanligvis en måte å bøye TextMate til deres vilje, og denne Quick Tip vil få deg i gang med å bøye for å bruke Dart med TextMate.


Forutsetninger

Jeg antar at du er kjent med TextMate-bunter i minst grad av hva de er, og at de legger til funksjonalitet (vanligvis språkspesifikk) til TextMate. Jeg antar også at du er kjent med og er i stand til å sjekke kode ut av et Subversion-depot. Til slutt antar jeg at du har en liten Dart-opplevelse. Du trenger ikke mye, men å ha litt Dart-filer rundt for å åpne i TextMate vil gjøre dette gå mye jevnere.

Hvis du ikke er kjent med Dart på dette punktet, kan jeg peke deg på den offisielle informasjonskilden: http://www.dartlang.org/. Utover det har Activetuts + tidligere publisert min introduksjonsveiledning på språket, Hva er Dart, og hvorfor bør du bry deg?


Installer Dart Editor

Vi vil egentlig ikke bruke Dart Editor (poenget med denne opplæringen er å bruke TextMate for Dart-utvikling), men nedlastingen inneholder Dart SDK, noe som egentlig er det vi leter etter. Selv om du er en hardcore TextMate fanatiker (som jeg er), er det fortsatt ikke en forferdelig ide å ha den "offisielle" Dart Editor installert og hendig.

På den offisielle Dart-siden (se forrige avsnitt), kan du laste ned Dart Editor fra følgende lenke: http://www.dartlang.org/docs/getting-started/editor/index-macos.html

Hvis du er på Windows eller Linux, men likevel leser denne opplæringen til tross for sin Mac-sentriske natur, kan du laste ned Dart Editor for de plattformene fra Dart Editor for Windows og Linux sider.

Under "Trinn 1" på den siden finner du en lenke til en ZIP-fil som inneholder Dart-redigeringsprogrammet. Det er rundt 40 MB, så det er ikke en veldig tung nedlasting.

Dart Editor er basert på Eclipse, så hvis du har brukt det, vil du være hjemme med Dart Editor. Jeg vil ikke komme inn på detaljer om å bruke den i denne opplæringen, men vær så snill å leke med den. Den nåværende Activetuts + Facebook Fan Bonus tar deg gjennom den grunnleggende bruken av Dart Editor.

(Merk at hvis du ikke vil installere Dart Editor, kan du laste ned bare Dark SDK for ditt operativsystem på denne nettadressen (det er bare 2 eller 3 MB): http://www.dartlang.org/docs/getting -started / SDK / index.html


Installere frogc

frogc er Dart-to-JavaScript-kompilatoren. Det er et kommandolinjeverktøy, men det er heldigvis enkelt å bruke. Vi bruker det i en TextMate-kommando senere for å slå vår Dart-fil (er) til JavaScript, slik at vi faktisk kan bruke vår Dart-kode i dag.

Åpne opp Terminal (funnet i din / Programmer / Verktøy / mappe). Skriv inn følgende:

 nano ~ / .bash-profil

Hvis du allerede har noen PATH-tilpasninger pågår, plasserer du markøren etter disse linjene.

Type:

 eksporter PATH = $ PATH:

Og dra deretter bin mappe, som skal ligge på / Applikasjoner / dart / dart-SDK / bin, inn i Terminal-vinduet. Hvis det ikke er i den plasseringen, se etter en dart-SDK mappe i noe du lastet ned (hvis du lastet ned SDK av seg selv, bør dette være det nedlasting, unzipped). Du bør ende opp med noe slikt:

 eksporter PATH = $ PATH: / Programmer / dart / dart-sdk / bin

For å lagre denne filen, trykk Control-O (det er Styre, ikke kommando), trykk Retur for å bekrefte filen som skal lagres, og trykk deretter Control-X for å gå ut av nano.

Nesten klar; Jeg har funnet et problem med frogc hvis du tilfeldigvis har mellomrom i fil- eller mappens navn. Dette kan imidlertid lett løst, skjønt. Åpne opp frogc. Det er et eksekverbart shell script, så ikke dobbeltklikk på det. I stedet dra den til tekstmate-ikonet, og du kan bli presentert med en advarselsdialog, men du bør kunne se det korte skriptet. Du trenger ikke å forstå hva dette gjør, bare endre den siste linjen fra dette:

 $ SCRIPTPATH ​​/ dart --new_gen_heap_size = 128 $ SCRIPTPATH ​​/ frogc.dart --libdir = $ LIBPATH $ @

… til dette:

 "$ SCRIPTPATH ​​/ dart" --new_gen_heap_size = 128 "$ SCRIPTPATH ​​/ frogc.dart" --libdir = "$ LIBPATH" "$ @"

Legg merke til at jeg i utgangspunktet har omgitt hver sti med anførselstegn, noe som bidrar til å unngå romproblemet.


Installer Googles Dart TMBundle

Du kan finne .tmbundle på denne Google-kodesiden.

Du kan enten sjekke ut hele Dart-kilden, som kan være interessant å peke gjennom, eller du kan bare sjekke ut .tmbundle. Bruk Terminal, naviger til stedet der du vil ha koden (type cd så dra destinasjonsmappen til Terminal-vinduet igjen - merk at det er et mellomrom etter cd). Når Terminal er på ønsket sted, skriv inn dette for en full kassa:

 svn checkout http://dart.googlecode.com/svn/trunk/ dart-read-only

... eller dette for bare .tmbundle:

 svn kassen http://dart.googlecode.com/svn/branches/bleeding_edge/dart/tools/utils/textmate/Dart.tmbundle

Hvis du har sjekket ut hele prosjektet, kan du navigere til .tmbundle ved å følge denne banen fra prosjektroten: [Dart-read-only] /dart/tools/utils/textmate/Dart.tmbundle. Uansett, dobbeltklikk på .tmbundle å ha TextMate installert den.

Mange TextMate-brukere liker å bare sjekke .tmbundles ut direkte til buntkatalogen. For å gjøre dette, naviger til den katalogen i Terminal (dette bør gjøre det: cd "~ / Bibliotek / Application Support / TextMate / Pristine Copy / Bundles") og kjør deretter den andre svn kassa linjen over (den som sjekker ut bare .tmbundle). På denne måten kan du enkelt oppdatere bunten på plass med svn up "~ / Bibliotek / Application Support / TextMate / Pristine Copy / Bundles".


Skriv en kommando for å kompilere dart til JavaScript

Google Dart Bundle er flott for å legge til syntaksstøtte for Dart, så når du lager en fil som slutter .dart du får farget syntaks og kodefelling og den slags ting. Men det inkluderer ikke noen utdrag eller kommandoer. Den mest nyttige kommandoen (det første jeg tenkte på) er en kommando for å kompilere ditt nåværende Dart-skript med frogc for deg. Vi legger til en i dette trinnet.

I TextMate, åpne Bundle Editor (trykk på Command-Option--B Kontroll, eller gå til Bundler> Bundle Editor> Vis Bundle Editor)

Klikk på Dart-oppføringen i venstre liste.

Med "+"Knappen nederst til venstre, velg" New Command ".

Du bør se en ny "untitled" -kommando vises under Dart-bunten. Gi nytt navn til "Compile with frogc"

I det store tekstområdet til høyre (merket "Command (s)"), skriv inn følgende:

 frogc "$ TM_FILEPATH"

Over tekstområdet har du muligheten til å ha kommandoen lagre filen før du kjører. Dette kan appellere til deg (det gjør meg, en mindre tastetrykk!). Hvis det gjør det, endrer du alternativet "Lagre" fra "Ingenting" til enten "Aktuell fil" eller "Alle filer i prosjekt".

Under tekstområdet, der det står "Input," sett det til "None".

Under det, der det står "Output", sett det til "Show as Tooltip". Dette lar alle utdata fra kommandoen vises i et verktøytips i nærheten av markøren, noe som betyr at du har feil mens du kjører frogc du kan se dem. De er ikke veldig pen, men det er bedre enn ingenting.

Under at, hvor det står "Aktivering", sørg for at den er satt til "Nøkkelekvivalent" og legg markøren i tekstfeltet til høyre. Skriv kommando-B; Dette setter denne kommandoen til å utløse når du skriver inn tastaturgenveien. Command-B er TextMate-idiomet for en Build-kommando hvis bunter har en.

Under det, der det står "Scope Selector," skriver du "source.dart # 8221;.

Ditt kommandovindu bør se slik ut:

Lukk Bundle Editor-vinduet.


Trinn 1: Fortell TekstMate Hvor frogc er

Vi har satt opp Terminal slik at den vet hvor frogc er, men dessverre deler TextMate ikke den informasjonen. Den enkleste løsningen er å legge til banen som vi har lagt til i .bash_profile-filen til dine Textmate-innstillinger.

Åpne TextMate-innstillingene (trykk på Kommando- eller gå til TextMate> Innstillinger ... ).

Klikk på Avansert-knappen øverst, og klikk deretter på Skiftvariabler-fanen.

Hvis du ikke allerede har en STI variabel, klikk på "+" -knappen og, i den første kolonnen, skriv inn STI.

I den andre kolonnen i raden som begynner STI, skriv inn banen du la til i .bash_profile (bare banen, ikke den delen som sier EXPORT PATH = @ PATH:). Pass på at du lar den eksisterende verdien være intakt - legg til et kolon på slutten av det som allerede finnes, og kopier deretter på den nye banen.

Lukk Innstillinger-vinduet, og du er klar til å prøve den. Hvis du trenger en Dart-fil, kan du enten opprette en Hello World-fil ved å opprette et nytt prosjekt med Dart Editor, eller du kan grave opp eksemplene fra Dart Editor-nedlastingen, i mappen "prøver". Åpne en Dart-fil i TextMate og klikk Command-B; Hvis alt går bra, bør du ha en JavaScript-fil ved siden av Dart-filen etter noen få sekunder.


Trinn 2: Få tilbakemelding fra frogc

Hvis du ønsker å bli litt mer avansert, kan du endre koden til kompileringskommandoen din til dette:

 result = "frogc" $ TM_FILEPATH "" hvis ["$ result" == ""]; deretter ekko "Kompilere fullført" annet ekko $ resultat fi

Dette vil gi deg en "Compile completed" tooltip en gang frogc er ferdig å kjøre, hvis det går vellykket. Hvis du har feil, vises de fremdeles som de gjorde før.

Et annet alternativ: Hvis du likte ideen om automatisk lagring av filer når du kjører kommandoen, kan du kanskje tenke på å erstatte Save-kommandoen med en Save-and-Compile-kommando. Dette er like enkelt som å bytte Command-B til Command-S, og sørg for at du lagrer "Current File" i kommandoen. Dette overstyrer den vanlige kommandoen-S, som bare lagrer gjeldende dokument, med utførelsen av denne kommandoen, som sparer og kompilerer deretter.

For fullstendighet kan du opprette en duplikat-kommando som sparer "Alle filer" og har en aktiveringsnøkkel for Command-Option-S. Denne snarveien vil tilsidesette den vanlige kommando-opsjonen-S i TextMate, som normalt lagrer alle filer i et prosjekt. Vær oppmerksom på at fordi du har angitt en Scope Selector, vil denne overstyringen bare skje i Dart-filer, ikke hver tid du lagrer noen filer.


Begynn å bygge utstykker

Det finnes potensielt mange nyttige utdrag som skal legges til et Dart-bunt. Vanligvis finner jeg meg selv gradvis å legge til dem som jeg lærer å lære et språk og oppdage at den eksisterende .tmbundle inneholder ikke allerede en. La meg komme i gang ved å legge til en utdrag som lager en ny metode.

I Bundle Editor må du kontrollere at Dart-bunten (eller et element i Dart-bunten) er valgt, og velg deretter "Ny utdrag" fra "+"-Knappen. Gi det navnet "metode".

I det store tekstområdet velger du all eksisterende tekst og sletter den. Skriv inn (eller lim inn) følgende:

 $ 1: void $ 2: methodName ($ 3: arguments) $ 0 $ 1 / void | (. +) / (? 1: \ n \ treturn null;) /

Under "Aktivering", still popup-vinduet til "Tab Trigger" og skriv inn metode i tekstfeltet (gjerne endre dette).

Skriv inn under "Scope Selector" source.dart.

Din utdrag skal se slik ut:

Lukk Bundle Editor.

Prøv det. I en Dart-fil, skriv "metode" (eller hva du angav, hvis du smidd din egen fanutløser), trykk på Tab og se den utvide. Du kan bla gjennom de ulike stoppene, starter ved returtype, deretter til metodenavnet, og til slutt mellom parentesene hvis du vil legge til argumenter. Den siste fanen vil slippe deg på første linje i metoden.

Den kule delen er at hvis du endrer returtype fra tomrom, du får automatisk return null uttalelse på slutten av metoden kropp. Selvfølgelig vil du tilpasse dette til dine behov, men forhåpentligvis er det en funksjon som sparer litt skrive. Den magiske hendelsen skjer i den uhåndterlige andre linjen i koden; hvis du aldri har sett dette før, så er det litt vanskelig å forklare konsistent, men det ser på innholdet i det første tabstoppet (returtype) og hvis det er noe annet enn "tomrom", Legger den til return null. Det kan være fornuftig hvis du noen gang har brukt vanlige uttrykk, spesielt med substitusjonssyntaxen til / Mønster / erstatning / funnet i Perl.

Gitt at Google ikke gir noen utdrag med deres .tmbundle, feltet er bredt åpent for oppretting av tidsbesparende Dart-fragmenter. Du er velkommen til å legge inn dine utdrag i kommentarene. Vi samler dem og ser om vi kan få Google til å innlemme dem i deres offisielle bunt.


Det er alt

Takk for at du leste! Jeg håper du er så spent på Dart som jeg er. Og Dart Editor er pent og alt, men jeg er en lure for TextMate. Kombinere Dart med min tekstredigerer er noe som bare måtte deles.