Tristan Jahier

Grumpy dev' (╯°□°)╯彡┻━┻until shit.changes {visit same_page; expect {shit}.to change}
← Retour

Ma Sublime configuration

Posted 24/11/2013  •  Written by Tristan Jahier  •  Category : Divers
Sublime Text 2 Depuis que j'ai découvert Sublime Text, je l'ai totalement adopté. Je l'utilise pour tout : édition de fichiers texte, développement web, développement logiciel etc. Évidemment, vu le nombre d'heures pendant lesquelles je l'utilise par jour, je l'ai un peu personnalisé. J'ai décidé de vous partager ma configuration, mes extensions, mes thèmes etc.

Les plugins que j'utilise

Package Control

IN.DIS.PEN.SABLE. Tout simplement. J'en parlais déjà quand je présentais Sublime Text dans cet article. C'est LE plugin de base. Il permet de gérer sa bibliothèque d'extensions très facilement.

Plus besoin de télécharger manuellement les plugins et de les mettre dans le bon répertoire. Il suffit d'ouvrir la palette de commande avec Ctrl+Maj+P, de taper "Install Package" et de valider. Package Control va alors récupérer la liste des plugins qu'il connaît et vous afficher un sous-menu dans lequel vous pourrez rechercher et sélectionner ce qui vous intéresse.

En plus, son installation est facilitée : il suffit de copier/coller une ligne de code Python dans la console interne de Sublime Text, et Package Control est téléchargé et installé au bon endroit automatiquement.

» Installation de Package Control

SFTP

Secure File Transfer Protocol. Un très bon plugin, du même auteur que Package Control, qui vous permettra de gérer vos dossiers distants grâce au protocole FTP. Vous pouvez envoyer, télécharger, synchroniser (dans les 2 sens), supprimer vos fichiers et même parcourir un serveur distant.

Attention, ce plugin n'est pas libre, vous devriez acheter une licence si vous comptez l'utiliser à long terme.

» WBond SFTP (Peut être installé avec Package Control)

Alignment

Quand vous déclarez une liste de variables avec leurs valeurs, ou quand vous déclarez une hashmap par exemple, vous souhaitez parfois aligner tous les signes '=', mais c'est pénible de le faire à la main ? Ce plugin est là pour ça. Avec la sélection multiple, placez votre curseur devant tous les signes '=' et appuyez sur ctrl+alt+a (OS X : cmd+ctrl+a). Alignment ajoutera des tabulations ou des espaces pour les aligner.

» WBond Alignment (Peut être installé avec Package Control)

Sass & Compass

Si vous êtes développeur web, vous connaissez/utilisez certainement les technologies Sass et Compass. Si ce n'est pas le cas, je vous conseille mon article sur le sujet.

Sass Package est un plugin qui apporte la coloration syntaxique et l'auto-complétion pour les formats SASS et SCSS, ainsi qu'un build system intégré à Sublime Text et une fonction de sass watch. Compass Build System quant à lui apporte le support du framework Compass. A noter que vous devez avoir Ruby et Compass installés sur votre machine. Ce plugin ne sert qu'à faire le lien entre Compass et votre projet.

» Sass Package
» Compass Build System (Peut être installé avec Package Control)

Vous devriez avoir un problème très gênant, et qui m'a personnellement bien pris la tête : vos fichiers .sass. ne devraient pas avoir la bonne coloration syntaxique, et être systématiquement reconnu comme Ruby Haml. La faute au plugin Rails présent par défaut. Explication et solution ici : http://stackoverflow.com/a/14071819/1529790.

Emmet

Anciennement Zen-coding, Emmet est un plugin qui permet de générer de l'HTML très facilement, en tab-complétion et avec des sélecteurs style CSS. Puisque qu'un exemple vaut bien mille explications :

div.details>(span.name+span.desc+ul>li*3)

Un coup de tab, et ça devient :

<div class="details">
    <span class="name"></span>
    <span class="desc"></span>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

Magique n'est-ce pas ?

» Emmet (Peut être installé avec Package Control)

Mes thèmes

Coloration syntaxique : Tomorrow

Au début j'utilisais le thème Monokai pour la coloration syntaxique parce que c'est l'un des plus beaux et lisible à la fois. Mais j'ai changé pour Tomorrow Theme. C'est un ensemble de thème au couleurs pastel disponibles en sombre et en clair. Pour ma part j'utilise la version Tomorrow Night, j'adore les couleurs et c'est vraiment très lisible.

» Tomorrow Theme (Peut être installé avec Package Control)

Thème de Sublime Text : Soda

L'apparence graphique de base de Sublime Text est excellente. Elle est à la fois sobre, classe et fonctionnelle. Mais sachez que même cela on peut le changer. Vous pouvez installer des thèmes personnalisés pour le logiciel en lui-même. J'ai été séduit par Soda, un thème qui ne s'éloigne pas trop du design d'origine, mais qui modifie l'apparence des onglets, la barre latérale, les icônes...

Je vous conseille d'activer les icônes de dossiers à la place des flèches traditionnelles dans l'arborescence de la barre latérale en ajoutant dans votre fichier de configuration (Preferences.sublime-settings) :

"soda_folder_icons": true

Il existe une version foncée et une version claire. Aucune des 2 versions ne me satisfaisait pleinement, je voulais que la barre latérale reste claire. J'ai donc créé un hybride baptisé Zebra (noir et blanc). Vous pouvez télécharger le fichier de thème ici : Soda Zebra. Le fichier est à placer dans le répertoire Packages/Theme - Soda de Sublime Text.

» Soda Theme (Peut être installé avec Package Control)

Ma configuration

{
    "detect_slow_plugins": false,
    "ignored_packages":
    [
        "Vintage"
    ],
    "update_check": false,
    "font_face": "Monaco",
    "font_size": 8,
    "color_scheme": "Packages/Tomorrow Color Schemes/Tomorrow-Night.tmTheme",
    "theme": "Soda Zebra.sublime-theme",
    "soda_folder_icons": true,
    "caret_style": "phase",
    "highlight_line": true,
    "tab_size": 2,
    "translate_tabs_to_spaces": true,
    "word_wrap": true,
    "wrap_width": 80
}

La police

J'ai aussi changé ma police par défaut. J'ai choisi Monaco, une police très élégante et parfaite pour afficher du code source. Malheureusement c'est une police propriétaire qui n'est disponible que sur Mac OS X. Mais vous commencez à connaître votre serviteur... Télécharger Monaco.ttf pour Windows.

Toujours sous OS X vous avez aussi Menlo qui est bien. Et sous Windows vous avez Consolas par défaut. Vous pouvez aussi télécharger Inconsolata ou Meslo LG qui sont elles open-source.

L'indentation

Par défaut l'indentation est définie par des tabulations de taille 4. Pour ma part je préfère une indentation de 2 espaces, qui est définie par défaut grâce à "tab_size": 2 et "translate_tabs_to_spaces": true.

Autres fioritures

  • "highlight_line": true permet de mettre la (ou les) ligne(s) courante(s) en surbrillance, ce qui peut être utile.
  • "caret_style": "phase" permet d'avoir un curseur avec un effet de fondu plus prononcé que par défaut.

Voilà, c'est à peu près tout. J'espère vous avoir donné des idées. N'hésitez pas à me partager vos propres plugins et thèmes dans les commentaires.

K0N4M1 C0D3