Dart est un nouveau langage plutôt cool qui pourrait entraîner un changement dans la manière dont vous écrivez des applications Web. Google fournit un éditeur de fléchettes basé sur Eclipse qui fournit un moyen pratique de commencer. Mais les utilisateurs de TextMate trouvent généralement un moyen de plier TextMate à leur guise, et ce petit conseil vous permettra de commencer à utiliser Dart avec TextMate..
Je suppose que vous connaissez au moins les ensembles TextMate et qu’ils ajoutent des fonctionnalités (généralement spécifiques à la langue) à TextMate. Je suppose également que vous connaissez et êtes capable de extraire du code d'un référentiel Subversion. Enfin, je suppose que vous avez une petite expérience de Dart. Vous n'avez pas besoin de beaucoup, mais avoir quelques fichiers Dart à ouvrir dans TextMate facilitera grandement les choses..
Si vous ne connaissez pas encore Dart à ce stade, je peux vous indiquer la source d’information officielle: http://www.dartlang.org/. Au-delà, Activetuts + a déjà publié mon didacticiel d'introduction sur le langage, Qu'est-ce que Dart et Pourquoi devriez-vous vous en soucier??
Nous n'utiliserons pas vraiment l'éditeur de fléchettes (le but de ce tutoriel est d'utiliser TextMate pour le développement de Dart), mais le téléchargement inclut le SDK Dart, qui est vraiment ce que nous recherchons. Même si vous êtes un fanatique hardcore de TextMate (comme moi), ce n’est pas une si mauvaise idée d’avoir l’éditeur de fléchettes «officiel» installé et pratique..
Sur le site officiel de Dart (voir la section précédente), vous pouvez télécharger l'éditeur de fléchettes à partir du lien suivant: http://www.dartlang.org/docs/getting-started/editor/index-macos.html
Si vous utilisez Windows ou Linux et lisez ce didacticiel malgré sa nature centrée sur Mac, vous pouvez télécharger l'éditeur de fléchettes pour ces plates-formes à partir des pages Editeur de fléchettes pour Windows et Linux..
Sous «Étape 1» de cette page, vous trouverez un lien vers un fichier ZIP contenant les éditeurs de fléchettes. C'est environ 40 Mo, donc le téléchargement n'est pas très lourd.
L'éditeur de fléchettes est basé sur Eclipse. Par conséquent, si vous l'avez déjà utilisé, vous serez parfaitement à l'aise avec l'éditeur de fléchettes. Je ne vais pas entrer dans les détails sur son utilisation dans ce tutoriel, mais n'hésitez pas à jouer avec. Le bonus pour fans actuel d'Activetuts + Facebook vous explique l'utilisation de base de l'éditeur de fléchettes..
(Notez que si vous ne souhaitez pas installer Dart Editor, vous pouvez télécharger uniquement le SDK Dark pour votre système d'exploitation à cette adresse URL (il ne s'agit que de 2 ou 3 Mo): http://www.dartlang.org/docs/getting -started / sdk / index.html
frogc
frogc
est le compilateur Dart-to-JavaScript. C'est un outil en ligne de commande, mais heureusement, il est facile à utiliser. Nous l'utiliserons ultérieurement dans une commande TextMate pour convertir nos fichiers Dart en JavaScript afin que nous puissions utiliser notre code Dart aujourd'hui..
Ouvrir le terminal (trouvé dans votre / Applications / Utilitaires /
dossier). Tapez ce qui suit:
nano ~ / .bash-profile
Si vous avez déjà des personnalisations PATH en cours, placez votre curseur après ces lignes.
Type:
export PATH = $ PATH:
Et puis faites glisser le poubelle
dossier, qui devrait être situé à / Applications / dart / dart-sdk / bin
, dans la fenêtre du terminal. Si ce n'est pas à cet endroit, cherchez un dart-sdk
dossier dans quelque chose que vous avez téléchargé (si vous avez téléchargé le SDK par lui-même, cela devrait être ce téléchargement, décompressé). Vous devriez vous retrouver avec quelque chose comme ça:
export PATH = $ PATH: / Applications / dart / dart-sdk / bin
Pour enregistrer ce fichier, appuyez sur Ctrl-O Contrôle, pas Command), appuyez sur Entrée pour confirmer le fichier à enregistrer, puis appuyez sur Ctrl-X pour quitter nano..
Presque prêt; J'ai trouvé un problème avec frogc
si vous avez des espaces dans vos noms de fichiers ou de dossiers. Cela peut être facilement résolu, cependant. S'ouvrir frogc
. C'est un script shell exécutable, alors ne double-cliquez pas dessus. Au lieu de cela, faites-le glisser sur votre icône TextMate. Une boîte de dialogue d'avertissement peut s'afficher, mais vous devriez pouvoir voir le script court. Vous n'avez pas besoin de comprendre ce que cela fait, changez simplement la dernière ligne:
$ SCRIPTPATH / dart --new_gen_heap_size = 128 $ SCRIPTPATH / frogc.dart --libdir = $ LIBPATH $ @
… pour ça:
"$ SCRIPTPATH / dart" --new_gen_heap_size = 128 "$ SCRIPTPATH / frogc.dart" --libdir = "$ LIBPATH" "$ @"
Notez que j'ai essentiellement entouré chaque chemin de guillemets, ce qui permet d'éviter le problème d'espace..
Vous pouvez trouver le .tmbundle
sur cette page de code Google.
Vous pouvez consulter la source entière de Dart, ce qui peut être intéressant, ou simplement consulter la .tmbundle
. À l’aide du terminal, naviguez jusqu’à l’emplacement où vous souhaitez avoir le code (tapez CD
puis faites glisser le dossier de destination dans la fenêtre du terminal à nouveau - notez qu'il y a un espace après CD
). Une fois que le terminal est à l’emplacement de votre choix, saisissez-le afin de procéder au paiement complet:
svn checkout http://dart.googlecode.com/svn/trunk/ dart-read-only
… Ou ceci pour juste le .tmbundle
:
svn checkout http://dart.googlecode.com/svn/branches/bleeding_edge/dart/tools/utils/textmate/Dart.tmbundle
Si vous avez extrait l'intégralité du projet, vous pouvez accéder à la .tmbundle
en suivant ce chemin depuis la racine du projet: [dart-read-only] /dart/tools/utils/textmate/Dart.tmbundle
. De toute façon, double-cliquez sur le bouton .tmbundle
avoir TextMate l'installer.
De nombreux utilisateurs de TextMate aiment simplement vérifier .tmbundles
directement sur leur répertoire de paquets. Pour ce faire, accédez à ce répertoire dans Terminal (cela devrait le faire: cd "~ / Bibliothèque / Application Support / TextMate / Copie Pristine / Bundles"
), puis exécutez la deuxième ligne svn checkout ci-dessus (celle qui ne vérifie que le .tmbundle
). De cette façon, vous pouvez facilement mettre à jour le paquet sur place avec svn up "~ / Bibliothèque / Application Support / TextMate / Copie vierge / Bundles"
.
Google Dart Bundle est idéal pour ajouter un support de syntaxe pour Dart. Ainsi, lorsque vous créez un fichier se terminant par .dard
vous obtenez la syntaxe colorée et le pliage de code et ce genre de chose. Mais cela n'inclut pas d'extraits ou de commandes. La commande la plus utile (en effet, la première chose à laquelle j'ai pensé) est une commande permettant de compiler votre script Dart actuel avec frogc
pour vous. Nous en ajouterons un dans cette étape.
Dans TextMate, ouvrez l’éditeur d’ensemble (appuyez sur Commande-Option-Contrôle-B, ou aller à Bundles> Bundle Editor> Afficher Bundle Editor)
Cliquez sur l'entrée Dart dans la liste de gauche.
Avec le "+”En bas à gauche, choisissez“ Nouvelle commande ”.
Vous devriez voir apparaître une nouvelle commande «sans titre» sous le lot de fléchettes. Renommez le en “Compiler avec frogc”
Dans la grande zone de texte à droite (intitulée «Commande (s)»), entrez les informations suivantes:
frogc "$ TM_FILEPATH"
Au-dessus de la zone de texte, vous avez la possibilité de faire en sorte que la commande enregistre le fichier avant de l'exécuter. Cela pourrait vous intéresser (cela me concerne; une frappe de moins!). Si tel est le cas, modifiez l'option «Enregistrer» de «Rien» en «Fichier actuel» ou «Tous les fichiers du projet»..
Sous la zone de texte, où il est écrit «Entrée», réglez-le sur «Aucun»..
En dessous de ce champ, où il est indiqué «Sortie», définissez-le sur «Afficher en tant qu’info-bulle». Cela permet à toute sortie de la commande d’être affichée dans une info-bulle près du curseur, ce qui signifie que si vous rencontrez des erreurs lors de l’exécution frogc
vous pouvez les voir. Ils ne sont pas terriblement jolis mais c'est mieux que rien.
Au dessous de cette, "Activation", assurez-vous qu'il est réglé sur "Équivalent clé", puis placez votre curseur dans le champ de texte à droite. Tapez Commande-B; Cette opération active cette commande lorsque vous tapez ce raccourci clavier. Commande-B est l'idiome TextMate d'une commande de construction si les ensembles en ont un.
En dessous, où il est indiqué «Sélecteur de portée», tapez «source.dart # 8221;.
Votre fenêtre de commande devrait ressembler à ceci:
Fermer la fenêtre de l'éditeur de bundles.
frogc
estNous avons mis en place Terminal afin qu'il sache où frogc
Malheureusement, TextMate ne partage pas cette information. La solution la plus simple consiste à ajouter le chemin que nous avons ajouté au fichier .bash_profile à vos préférences Textmate..
Ouvrez les préférences de TextMate (appuyez sur Commande ou allez à TextMate> Préférences… ).
Cliquez sur le bouton Avancé en haut, puis sur l'onglet Variables Shell..
Si vous n'avez pas déjà un CHEMIN
variable, cliquez sur le bouton “+” et, dans la première colonne, tapez CHEMIN
.
Dans la deuxième colonne de la ligne qui commence CHEMIN
, tapez le chemin que vous avez ajouté à la .bash_profile
(juste le chemin, pas la partie qui dit CHEMIN D'EXPORTATION = @ CHEMIN:
). Assurez-vous de laisser la valeur existante intacte - ajoutez deux points à la fin de ce qui y est déjà, puis copiez-la dans le nouveau chemin.
Fermez la fenêtre Préférences et vous êtes prêt à l'essayer. Si vous avez besoin d'un fichier Dart, vous pouvez soit créer un fichier Hello World en créant un nouveau projet avec Dart Editor, soit vous pouvez extraire les exemples du téléchargement du logiciel Dart Editor, dans le dossier «samples». Ouvrez un fichier Dart dans TextMate et appuyez sur Commande-B; si tout se passe bien, vous devriez avoir un fichier JavaScript à côté du fichier Dart après quelques secondes.
frogc
Si vous souhaitez devenir un peu plus amateur, vous pouvez changer le code de votre commande de compilation en ceci:
resultat = "frogc" $ TM_FILEPATH "" if ["$ result" == ""]; then echo "Compile completed" sinon echo $ result fi
Cela vous donnera une info-bulle «Compiler terminé» une fois frogc
est fait en cours d'exécution, s'il fonctionne avec succès. Si vous avez des erreurs, elles apparaîtront toujours comme avant.
Une autre option: si vous avez aimé l'idée de sauvegarder automatiquement les fichiers lors de l'exécution de la commande, vous pourriez aussi aimer remplacer la commande Enregistrer par une commande Enregistrer-et-Compiler. Cela est aussi simple que de changer Command-B en Command-S et de vous assurer que vous enregistrez le «Fichier actuel» dans la commande. Ceci remplace la commande-S normale, qui enregistre simplement le document actuel, avec l'exécution de cette commande, qui enregistre puis compile.
Pour être complet, vous pouvez créer une commande en double qui enregistre «Tous les fichiers» et possède une clé d'activation de Commande-Option-S. Ce raccourci remplacera Command-Option-S normal dans TextMate, qui enregistre normalement tous les fichiers d'un projet. Notez que, comme vous avez défini un sélecteur de portée, cette substitution ne se produira que dans les fichiers Dart., ne pas chaque le temps que vous enregistrez un fichier.
Il existe potentiellement de nombreux extraits utiles à ajouter à un ensemble de fléchettes. En général, je les ajoute progressivement au fur et à mesure que je connais une langue et que je découvre que la .tmbundle
n'en inclut pas déjà un. Laissez-moi vous aider à commencer en ajoutant un extrait qui crée une nouvelle méthode.
Dans l’éditeur d’ensemble, assurez-vous que le jeu de fléchettes (ou un élément du paquet) est sélectionné, puis choisissez «Nouveau fragment» dans la liste+" bouton. Nommez-le "méthode".
Dans la grande zone de texte, sélectionnez tout le texte existant et supprimez-le. Maintenant, entrez (ou collez) ce qui suit:
$ 1: void $ 2: methodName ($ 3: arguments) $ 0 $ 1 / void | (. +) / (? 1: \ n \ treturn null;) /
Sous «Activation», configurez la fenêtre en incrustation sur «Déclencheur d’onglet» et entrez méthode
dans le champ de texte (n'hésitez pas à changer cela).
Sous «Sélecteur de portée», tapez source.dart
.
Votre extrait devrait ressembler à ceci:
Fermer l'éditeur de paquet.
Essaye le. Dans un fichier Dart, tapez "méthode" (ou ce que vous avez spécifié, si vous avez falsifié votre propre déclencheur de tabulation), appuyez sur Tabulation et observez-le se développer. Vous pouvez parcourir les différents arrêts, en commençant par le type de retour, puis par le nom de la méthode, et enfin entre les parenthèses si vous souhaitez ajouter des arguments. Le dernier onglet vous laissera tomber à la première ligne de la méthode.
La partie intéressante est que si vous modifiez le type de retour de vide
, vous obtenez un automatique retourne null
déclaration à la fin de votre corps de méthode. Naturellement, vous voudrez l'adapter à vos besoins, mais j'espère que c'est une fonctionnalité qui vous permettra d'économiser un peu de frappe. La magie se passe dans la deuxième ligne lourde de l'extrait; Si vous ne l'avez jamais vu auparavant, il est un peu difficile de l'expliquer de façon concise, mais le contenu du premier point de tabulation (le type de retour) est examiné et s'il s'agit de quelque chose d'autre que «vide
”, Ajoute-t-il retourne null
. Si vous avez déjà utilisé des expressions régulières, en particulier avec la syntaxe de substitution / pattern / substitute /
trouvé à Perl.
Étant donné que Google ne fournit aucun extrait avec leur .tmbundle
, grande ouverture du champ pour la création d'extraits de Dart rapides. N'hésitez pas à poster vos extraits dans les commentaires. Nous allons les compiler et voir si nous pouvons faire en sorte que Google les intègre dans leur lot officiel..
Merci d'avoir lu! J'espère que vous êtes aussi enthousiasmé par Dart que moi. Et l'éditeur de fléchettes est soigné et tout, mais je suis un imbécile pour TextMate. Combiner Dart avec mon éditeur de texte préféré est quelque chose qui devait être partagé.