Sublime Text est un éditeur de texte assez génial, léger et customisable à souhaits grâce aux nombreux plugins existants.

Le logiciel est disponible sur Windows, Linux et Mac, sa version actuelle est la 2.0.2, la version 3 est en beta (à suivre ici).

ST2 est payant mais il est possible d’utiliser la version d’essai, il n’y a pas de limite dans le temps (ni de limite de fonctionnalités), seulement un message, de temps en temps, vous proposant d’acquérir une licence.

Raccourcis utiles

• CTRL+MAJ+P : accès aux commandes de Sublime Text, par exemple sur un nouveau fichier, pour avoir la coloration syntaxique en PHP, taper « ssphp » (Set Syntax PHP)
• CTRL+P : permet de rechercher un fichier rapidement. Entrer « @ » dans le champ permet de rechercher un nom de fonction
• CTRL+CLICK : à la manière de la multi-sélection de fichiers, on peut mettre le curseur à plusieurs endroits différents
• CTRL+MAJ+L : focus sur les fins de lignes pour faire des modifications de masse (sélectionner toutes les lignes avant)
• CTRL+SHIFT+FLECHE : déplace une ligne
• CTRL+SHIFT+NUMERO : permet de scinder la vue en plusieurs parties
• CTRL+ALT+P : pour switcher entre les différents projets

 

Tips

• Pour entourer un bout de code avec des guillemets, cotes, parenthèses, ou accolades : sélectionner le bout de code et appuyer une fois sur le caractère voulu.
• Auto-complétion : TAB va remplir automatiquement (avec la première proposition), CTRL+SPACE va lister les propositions d’auto-complétion.
• Taper « lorem » + TAB et vous aurez un joli paragraphe loremipsum
• Sélection avec le clic milieu (sélection de “colonne”)
• Distraction free mode : SHIFT+F11 (pour enlever le wordwrap, éditer le fichier suivant : Packages/Default/Distraction Free.sublime-settings)
• Project : vous pouvez ajouter des projets et gérer des settings différents par projets (ex : indentation, dossier à afficher etc.). Sublime Text garde un historique des fichiers ouverts et des recherches par projets.
• Diff Files : pour voir la différence entre 2 fichiers, les sélectionner sur la gauche, puis clic droit -> Diff Files…
• Fichiers ouverts : pour afficher les fichiers en cours d’édition dans la partie de gauche : View -> Side Bar -> Show Open Files

 

Config

Dans Preferences > Settings – Default ou User, vous pouvez modifier certaines config du logiciel, voici un exemple des valeurs que j’ai changées :

{
    "highlight_line": true,
    "highlight_modified_tabs": true,
    "line_padding_bottom": 2,
    "line_padding_top": 2,
    "tab_size": 4,
    "translate_tabs_to_spaces": true,
    "word_wrap": false
}

Il est également possible de gérer ses raccourcis claviers si ceux par défauts ne conviennent pas, dans Preferences > Key bindings– Default ou User. Exemple, par défaut CTRL+D permet de trouver les instances d’un mot surligné. Je préfère que le comportement de ce raccourci duplique la ligne sur laquelle je suis :

[
    { "keys": ["ctrl+d"], "command": "duplicate_line" },
    { "keys": ["ctrl+shift+d"], "command": "find_all_under" }
]

 

Plugins

La première extension à installer est celle qui permet de gérer les plugins par la suite (installation/suppression/recherche …) : Sublime Package Control.

Ensuite l’installation des plugins se fait par cette extension, un nouveau menu apparaît dans Sublime Text, dans Preferences > Package Control.
Il suffit de cliquer sur Install Packages et de taper le nom du plugin voulu.
Pour rechercher des plugins, direction la liste des packages.
Plus rapide, sans passer par la souris, CTRL+MAJ+P, taper « install ».

Pour certains plugins si l’installation ne se fait pas automatiquement, aller dans Preferences > Browse Packages et y déposer le contenu du package voulu (généralement disponible sur GitHub).

Exemple de quelques plugins intéressants :

• Alignment : permet d’aligner rapidement plusieurs éléments de lignes (dans un array par exemple)
• HTML5 : ajoute l’auto-complétion de plusieurs tags HTML5
• Prefixr : ajoute les prefix CSS -webkit, -moz etc.
• SublimeCodeIntel : ajoute de l’auto-complétion sur de nombreux langages (SASS, LESS, PHP)
• Emmet : permet de générer rapidement du code HTML, exemple : ul.menu>li*5>a + TAB va générer un menu UL avec la classe « menu », et 5 LI avec une balise A à l’intérieur
• Emmet LiveStyle : en combinant ce plugin avec le plugin Chrome du même nom, les modifications CSS seront visible en live sur le navigateur (la modification du fichier rafraîchi le navigateur automatiquement)
• SCSS : gère la coloration des fichiers SCSS
• PHP-Twig : même chose mais pour les fichiers Twig
• Xdebug client : permet d’effectuer du debogage point par point avec l’extension PHP xdebug

 

Projets

Comme dit plus haut dans les Tips, il est possible d’avoir plusieurs « projets » dans lesquels on précise quels dossiers on veut voir apparaître sur la gauche, quels fichiers on veut laisser ouvert etc. On peut ensuite facilement passer d’un projet à l’autre grâce au raccourci CTRL+ALT+P.

En allant dans Project -> Save Project As…, Sublime Text créera 2 fichiers :

• nomduprojet.sublime-project : fichier de config du projet, que vous pouvez éditer manuellement (exemple à suivre), un double clic lancera Sublime Text sur ce projet, pour l’éditer il faut donc faire clic droit -> éditer avec…
• nomduprojet.sublime-workspace : ce fichier stock votre historique de fichiers ouverts, de recherches etc. sur ce projet uniquement

Exemple de fichier .sublime-project customisé :

{
    "folders":
    [
        {
            "path": "/Z/mon-projet",
            "folder_exclude_patterns": [".settings",".sass-cache"],
            "file_exclude_patterns": [".buildpath",".project"]
        },
        {
            "path": "/Y/usr/share/php/Zend"
        }
    ]
}

J’inclue le dossier de mon projet (qui sera donc visible dans la side bar), je lui dit de ne pas m’afficher les dossiers « .settings » et « .sass-cache », qui ne me servent à rien et pollueront la visibilité. Je lui indique la même chose pour les fichiers « .buildpath » et « .project ». Enfin, je lui dit de m’inclure le dossier Zend, pour avoir un accès rapide aux classes.

Voila pour un tour d’horizon des possibilités offertes par Sublime Text.