Snabbtips Konfigurera TextMate för Dart-kodning

Dart är ett ganska coolt nytt språk som kan betyda en förändring av hur du skriver webbapplikationer. Google tillhandahåller en Eclipse-baserad Dart Editor som ger ett praktiskt sätt att komma igång. Men TextMate-användare brukar hitta ett sätt att böja TextMate till sin vilja, och den här snabba tipsen kommer att komma igång med att böja för att använda Dart med TextMate.


förutsättningar

Jag antar att du är bekant med TextMate-buntar åtminstone graden av vad de är och att de lägger till funktionalitet (vanligtvis språkspecifikt) till TextMate. Jag antar också att du är bekant med och kan kontrollera kod ur ett Subversion-arkiv. Slutligen antar jag att du har en liten Dart-upplevelse. Du behöver inte mycket, men med vissa Dart-filer runt för att öppna i TextMate kommer detta att bli mycket mjukare.

Om du inte är bekant med Dart vid denna tidpunkt kan jag peka dig på den officiella informationskällan: http://www.dartlang.org/. Utöver det har Activetuts + tidigare publicerat min inledande handledning på språket, Vad är Dart och varför ska du bry dig?


Installera Dart Editor

Vi kommer inte riktigt att använda Dart Editor (den här handledningen är att använda TextMate för Dart-utveckling), men nedladdningen innehåller Dart SDK, vilket verkligen är det vi söker efter. Även om du är en hardcore TextMate fanatiker (som jag är) är det fortfarande inte en hemsk idé att ha den "officiella" Dart Editor installerad och praktisk.

På den officiella Dart-webbplatsen (se föregående avsnitt) kan du ladda ner Dart Editor från följande länk: http://www.dartlang.org/docs/getting-started/editor/index-macos.html

Om du är på Windows eller Linux, men läser denna handledning trots sin Mac-centriska natur, kan du ladda ner Dart Editor för de plattformarna från Dart Editor för Windows och Linux-sidor.

Under "Steg 1" på den sidan hittar du en länk till en ZIP-fil som innehåller Dart Editors. Det är cirka 40 MB, så det är inte en väldigt tung nedladdning.

Dartredigeraren är baserad på Eclipse, så om du har använt det så kommer du vara hemma med Dart Editor. Jag kommer inte att få information om hur jag använder den i den här handledningen, men känner mig fri att leka med den. Den nuvarande Activetuts + Facebook Fan Bonus tar dig igenom den grundläggande användningen av Dart Editor.

(Observera att om du inte vill installera Dart Editor, kan du bara ladda ner Dark SDK för ditt operativsystem på den här webbadressen (det är bara 2 eller 3 MB): http://www.dartlang.org/docs/getting -started / sdk / index.html


Installera frogc

frogc är Dart-to-JavaScript-kompilatorn. Det är ett kommandoradsverktyg, men det är tack och lov lätt att använda. Vi använder det i ett TextMate-kommando senare för att göra vår Dart-fil (er) till JavaScript så att vi faktiskt kan använda vår Dart-kod idag.

Öppna upp Terminal (finns i din / Program / Verktyg / mapp). Skriv följande:

 nano ~ / .bash-profil

Om du redan har några PATH-anpassningar pågår placerar du markören efter dessa rader.

Typ:

 exportera PATH = $ PATH:

Och dra sedan bin mapp, som ska placeras på / Program / dart / dart-sdk / bin, in i Terminalfönstret. Om det inte finns på den platsen, leta efter en dart-sdk mapp i något som du hämtade ner (om du hämtade SDK självt, det borde vara den nedladdningen, unzipped). Du borde sluta med något så här:

 exportera PATH = $ PATH: / Program / dart / dart-sdk / bin

För att spara den här filen, tryck på Control-O (det vill säga Kontrollera, inte kommando), tryck på Retur för att bekräfta filen som ska sparas och tryck sedan på Control-X för att avsluta nano.

Nästan redo; Jag har hittat ett problem med frogc om du råkar ha mellanslag i dina fil- eller mappnamn. Det här kan dock enkelt sättas fast. Öppna frogc. Det är ett exekverbart skalskript, så dubbelklicka inte på det. Dra i stället till din TextMate-ikon, och du kan bli presenterad med en varningsdialog, men du borde kunna se det korta skriptet. Du behöver inte förstå vad det här gör, ändra bara den sista raden från det här:

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

… till detta:

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

Observera att jag i grunden har omringat varje väg med citat, vilket hjälper till att undvika rymdproblemet.


Installera Googles Dart TMBundle

Du kan hitta .tmbundle på den här Google-kodesidan.

Du kan antingen kolla hela Dart-källan, vilket kan vara intressant att peka igenom, eller du kan helt enkelt kolla in .tmbundle. Använd terminalen genom att navigera till den plats där du vill ha koden (typ CD dra sedan målmappen igen till Terminal-fönstret igen - observera att det finns ett mellanslag efter CD). När terminalen är på önskad plats, skriv detta in för en fullständig utcheckning:

 svn checkout http://dart.googlecode.com/svn/trunk/ endast skrivskyddad

... eller det här för bara .tmbundle:

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

Om du har kontrollerat hela projektet kan du navigera till .tmbundle genom att följa den här vägen från projektrot: [Dart skriv-] /dart/tools/utils/textmate/Dart.tmbundle. Hur som helst dubbelklicka på .tmbundle för att få TextMate att installera den.

Många TextMate-användare gillar att helt enkelt kolla .tmbundles ut direkt till deras bunt katalog. För att göra detta, navigera till den katalogen i Terminal (det här ska göra det: cd "~ / Bibliotek / Application Support / TextMate / Pristine Copy / Bundles") och kör sedan den andra svn-kassan ovan (den som bara checkar ut .tmbundle). På så sätt kan du enkelt uppdatera bunten på plats med svn up "~ / Bibliotek / Application Support / TextMate / Pristine Copy / Bundles".


Skriv en kommando för att kompilera pil på JavaScript

Google Dart Bundle är utmärkt för att lägga till syntaxstöd för Dart, så när du skapar en fil som slutar .pil du får färgad syntax och kodfällning och den typen av saker. Men det innehåller inte några utdrag eller kommandon. Det mest användbara kommandot (det första jag trodde på) är ett kommando att kompilera ditt aktuella Dart-skript med frogc till dig. Vi lägger till ett i det här steget.

I TextMate öppnar du Bundle Editor (tryck på Command-Option-Control-B, eller gå till Bundlar> Bundle Editor> Visa Bundle Editor)

Klicka på Dart-posten i vänstra listan.

Med "+"Knappen längst ner till vänster, välj" New Command ".

Du bör se ett nytt kommando med kommandot "Untitled" visas under Dart-bunten. Byt namn på den till "Kompilera med frogc"

I det stora textområdet till höger (märkt "Command (s)") anger du följande:

 frogc "$ TM_FILEPATH"

Över textområdet har du möjlighet att få kommandot att spara filen innan du kör. Detta kan tilltala dig (det gör för mig, en mindre tangenttryckning!). Om det gör, ändra sedan alternativet "Spara" från "Ingenting" till antingen "Aktuell fil" eller "Alla filer i projekt".

Under textområdet, där det står "Input", ställs det på "None".

Nedan där, där det står "Output", ställer det till "Show as Tooltip". Detta låter utdata från kommandot dyka upp i ett verktygstips nära markören, vilket innebär att du har fel när du kör frogc du kan se dem. De är inte hemskt vackra men det är bättre än ingenting.

Nedan den där, där det står "Aktivering", se till att den är inställd på "Key Equivalent" och placera markören i textfältet till höger. Typ Command-B; Detta ställer in det här kommandot för att utlösa när du skriver tangentbordets genväg. Command-B är TextMate-idiomet för ett Build-kommando om buntar har en.

Nedan det, där det står "Scope Selector," skriv "source.dart # 8221;.

Ditt kommandofönster bör se något ut så här:

Stäng redigeringsfönstret Bundle.


Steg 1: Berätta TextMate Var frogc är

Vi har satt upp Terminal så att den vet var frogc men, tyvärr, delar TextMate inte den informationen. Den enklaste lösningen är att lägga till sökvägen som vi lade till i .bash_profile-filen till dina Textmate-inställningar.

Öppna TextMates inställningar (tryck på Kommando- eller gå till TextMate> Inställningar ... ).

Klicka på knappen Avancerat längst upp och klicka sedan på fliken Shell Variabler.

Om du inte redan har en VÄG variabel, klicka på knappen + och i den första kolumnen skriver du VÄG.

I den andra kolumnen i raden som börjar VÄG, skriv sökvägen du lagt till i .bash_profile (bara vägen, inte den del som säger EXPORT PATH = @ PATH:). Var noga med att lämna det befintliga värdet intakt - lägg till ett kolon i slutet av det som finns redan och kopiera sedan i den nya vägen.

Stäng fönstret Inställningar, och du är redo att prova det. Om du behöver en Dart-fil kan du antingen skapa en Hello World-fil genom att skapa ett nytt projekt med Dart Editor, eller du kan gräva exemplen från Dart Editor-nedladdningen i mappen "samples". Öppna en Dart-fil i TextMate och klicka på Command-B; Om allt går bra borde du ha en JavaScript-fil bredvid Dart-filen efter några sekunder.


Steg 2: Få feedback från frogc

Om du vill bli lite snyggare kan du ändra koden i kompilera kommandot till det här:

 result = "frogc" $ TM_FILEPATH "" om ["$ result" == ""]; sedan echo "Kompilera avslutat" annars echo $ resultat fi

Detta ger dig en "Kompilera färdigställd" verktygstips en gång frogc är igång, om den körs framgångsrikt. Om du har fel visas de fortfarande som de gjorde tidigare.

Ett annat alternativ: om du gillade tanken att spara filer automatiskt när du kör kommandot, kanske du tycker om att byta kommandot Spara med ett Spara och kompilera kommando. Det här är lika enkelt som att ändra Command-B till Command-S, och se till att du sparar "Aktuell fil" i kommandot. Detta åsidosätter den vanliga Kommandot-S, som helt enkelt sparar det aktuella dokumentet, med utförandet av det här kommandot, vilket sparar och sammanställer sedan.

För fullständighet kan du skapa ett dubbletterkommando som sparar "Alla filer" och har en aktiveringsnyckel för Command-Option-S. Den här genvägen kommer att åsidosätta det vanliga kommandotillståndet-S i TextMate, vilket normalt sparar alla filer i ett projekt. Observera att eftersom du har ställt in en Omfattningsväljare, kommer denna åsidosättning bara att hända i Dart-filer, inte varje gången du sparar någon fil.


Börja bygga snippets

Det finns potentiellt många användbara utdrag att läggas till i en Dart-bunt. I allmänhet befinner jag mig själv stegvis med att lägga till dem som jag lär känna ett språk och upptäcker att det existerande .tmbundle innehåller inte redan en. Låt mig komma igång med att lägga till ett utdrag som skapar en ny metod.

I Bundle Editor, se till att Dart-buntet (eller ett objekt i Dart-bunt) är valt, välj sedan "New Snippet" från "+" knapp. Namn det "metod".

Markera all befintlig text i det stora textområdet och radera det. Ange nu (eller klistra in) följande:

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

Under "Aktivering", sätt popupen till "Tab Trigger" och skriv in metod i textfältet (gärna ändra det här).

Skriv in under "Scope Selector" source.dart.

Ditt kodstycke ska se ut så här:

Stäng Bundle Editor.

Testa. I en Dart-fil skriver du "metod" (eller vad du angav, om du smidda din egen flikutlösare), trycker du på Tab och ser den expandera. Du kan fliken genom de olika stoppen, börjar vid returtypen, sedan till metodnamnet, och slutligen mellan parenteserna om du vill lägga till argument. Den sista fliken kommer att släppa dig i den första raden i metoden.

Den snygga delen är det om du ändrar returtypen från ogiltig, du får en automatisk returnera null uttalande i slutet av din metod kropp. Naturligtvis vill du anpassa detta till dina behov, men förhoppningsvis är det en funktion som sparar lite typing. Magien händer i den obevekliga andra raden av utdraget. om du aldrig har sett det här förut är det lite svårt att förklara koncist, men det ser på innehållet i det första flikstoppet (returtypen) och om det är något annat än "ogiltig", Lägger den till returnera null. Det kan vara meningslöst om du någonsin har använt vanliga uttryck, särskilt med substitutionssyntaxen av / Mönster / substitut / hittades i Perl.

Med tanke på att Google inte ger några utdrag med deras .tmbundle, Fältet är öppet för att skapa tidsbesparande Dart-fragment. Skicka gärna dina formulär i kommentarerna. Vi sammanställer dem och ser om vi kan få Google att införliva dem i deras officiella bunt.


Det är allt

Tack för att du läser! Jag hoppas att du är så upphetsad över Dart som jag är. Och Dart Editor är snyggt och allt, men jag är en dåre för TextMate. Att kombinera Dart med min textredigerare är något som bara måste delas.