Comment dynamiser votre terminal Bash - Un guide étape par étape avec des images

Dans ce blog, je vais passer en revue les étapes pour ajouter des thèmes, Powerline, polices et powerline-gitstatus pour rendre votre terminal Bash régulier beau et utile, comme le montre l'image ci-dessus.

Il s'avère que si vous utilisez Mac, vous devrez franchir de nombreux obstacles pour que cela fonctionne, car de nombreuses instructions sont pour Linux ou sont obsolètes. Alors j'ai pensé bloguer à ce sujet - j'espère que cela vous aidera.

Remarques:

1. Suivez attentivement les étapes, car toute erreur causera beaucoup de maux de tête.

2. Ceci est pour MacOS et pour bash régulier dans le Terminal.app. Je n'utilise pas ZSH ou Hyper dans ce blog - je prévois d'écrire différents blogs pour eux.

3. Mes versions: Mac High Sierra; git version 2.14.3 (Apple Git-98); Python 2.7.10

OK, par défaut, lorsque vous avez un nouveau mac, votre Terminal.app ressemblera à quelque chose comme ci-dessous. Allons-y et ajoutons des thèmes, des polices, etc.

Étape 1 - Ajouter un nouveau thème

La première étape évidente consiste à améliorer le thème. Terminal ne fournit pas tous les thèmes sympas et fantaisistes que vous voyez d'autres développeurs utiliser. Téléchargeons un thème et ajoutons-le au terminal.

Dans ce blog, j'ajouterai le thème Solarized-Dark à notre terminal.

Remarque: vous pouvez télécharger divers thèmes (fichiers .terminal) à partir de ce dépôt git. Ouvrez simplement le *.terminalfichier pour l'installer, c'est-à-dire right-click on the *.terminal file > “open with" > Terminal
  1. Allez sur //ethanschoonover.com/solarized
  2. Faites défiler vers le bas et téléchargez le thème (solarized.zip)
  3. Extraire le fichier solarized.zip
  4. Ouvrez le dossier osx-terminal.app-colors-solarized . Ce dossier contient le thème du terminal.
  5. Double-cliquez sur le fichier «Solarized Dark ansi.terminal» - Il s'agit du fichier de thème spécifique pour Terminal.app. Remarque: si vous recevez un avertissement indiquant qu'il s'agit d'un développeur non identifié, cliquez avec le bouton droit sur le fichier et sélectionnez «Ouvrir avec»> Option du terminal .
  6. À ce stade, vous avez installé le thème dans votre terminal. Nous devons juste en faire un thème par défaut.
  7. Ouvrez Terminal> Préférences> Texte et sélectionnez le thème «Solarized Dark…» et cliquez sur «Par défaut».

À partir de maintenant, votre terminal devrait ressembler à ci-dessous.

Étape 2 - Installez Powerline

Powerline est une application Python et est un plugin de ligne d'état pour vim, et fournit des lignes d'état et des invites pour plusieurs autres applications, y compris zsh, bash, tmux, IPython, Awesome et Qtile.

Cela rend l'invite du terminal comme ci-dessous.

2.1 Installer Python

Parce que Powerline est une application Python, nous devons avoir Python et cela aussi une version appropriée de Python.

  • MacOS est déjà installé avec Python. Assurez-vous que la version de Python est 2.7.x en tapantpython -V dans le terminal.
  • Si ce n'est pas 2.7, installez Homebrew qui nous permet d'installer divers logiciels à partir de la CLI, en exécutant:/usr/bin/ruby -e "$(curl -fsSL //raw.githubusercontent.com/Homebrew/install/master/install)"
  • Exécutez brew install pythonpour installer le dernier Python via Homebrew

2.2 Install pip - Un gestionnaire de packages pour Python (similaire à npm)

Installez pip en exécutant la commande suivante

$ sudo easy_install pip

2.3 Installer les outils CLI de XCode Developer

Les outils CLI XCode Developer sont utilisés par Powerline et d'autres applications qui manipulent les fonctionnalités OSX principales. Assurez-vous donc d'installer les outils CLI XCode en exécutant la commande suivante.

$ xcode-select —-install

Remarque: la commande ci-dessus ouvre le programme d'installation de Mac et installe les outils CLI XCode Developer. Si cela ne fonctionne pas, essayez xcode-select -rde réinitialiser.

2.4 Installer Powerline

Enfin, installez le Powerline (version stable) via pip en exécutant la commande suivante.

$ pip install --user powerline-status

Si vous souhaitez installer la dernière branche de développement, utilisez:

$ pip install --user git+git://github.com/powerline/powerline //dev

2.5 Ajouter le démon Powerline à bash

Nous devons maintenant ajouter le démon Powerline à bash afin qu'il puisse surveiller l'invite du terminal et apporter des modifications.

2.5.1 Copier l'emplacement d'installation du Powerline

Vous pouvez déterminer l'emplacement de Powerline en exécutant ce qui suit: pip show powerline-statusCopiez la valeur du Locationchamp.

2.5.2 Ajouter le démon avec un emplacement approprié à .bash_profile

  1. Assurez-vous que vous avez un .bash_profilefichier dans votre répertoire racine. Sinon, créez-en un en faisant:cd ~ && touch ~/.bash_profile

2. Ouvrez .bash_profileet ajoutez ce qui suit:

export PATH=$PATH:$HOME/Library/Python/2.7/bin powerline-daemon -q POWERLINE_BASH_CONTINUATION=1 POWERLINE_BASH_SELECT=1 . /Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/bindings/bash/powerline.sh
Remarque: l'emplacement /Users/rupa/Library/Python/2.7/lib/python/site-packages/ provient de l'étape précédente (2.5.1). Modifiez-le pour qu'il corresponde à l'emplacement de votre ordinateur.

2.5.3. Redémarrez le terminal

Quittez complètement le terminal s'il est ouvert (Terminal> Quitter le terminal). Et ouvrez-le à nouveau.

Vous devriez pouvoir utiliser simplement $ source ~/.bash_profilepour mettre à jour les paramètres. Mais il me powerline-configmanque un fichier étrange ! Généralement, vous obtenez cette erreur si vous n'avez pas $ HOME / Library / Python / 2.7 / bin dans votre PATH.

2.5.4 Votre nouveau terminal

Votre nouveau terminal devrait ressembler à ci-dessous. Il devrait utiliser le thème «Solarized Dark ansi» et afficher Powerline dans l'invite de commande. Mais remarquez également qu'il y a des «?» personnages! Cela est dû au fait que Powerline utilise diverses icônes et polices qui ne sont pas disponibles par défaut. Nous devons donc installer les polices.

Étape 3 - Installez les polices Powerline

Pour installer les polices Powerline, rendez-vous simplement sur //github.com/powerline/fonts. Là, vous verrez tout un tas de dossiers. Chacun est une police, également appelée «polices corrigées».

On l'appelle «Polices corrigées» parce que les gens ont pris des polices régulières et y ont ajouté / corrigé des icônes et des polices supplémentaires spécifiques à Powerline.

3.1 Téléchargez le référentiel entier et décompressez-le

  • Cliquez sur le bouton "Cloner ou télécharger" et téléchargez l'ensemble du dépôt pour essayer différentes polices.
  • Décompressez le fichier fonts-master.zip

3.2 Installer certaines polices

Let’s open Meslo dotted fontsfolder. It will look like below. You’ll see a whole bunch of .ttf file. Each one of them is a font but some are “bold” version of the font, some are “regular” version and so on.

Simply double-click on the .ttf file and press “Install font” to install the font on your computer.

For our case, let’s install “Meslo LG L DZ Regular for Powerline.ttf” and “Meslo LG L DZ Italic for Powerline.ttf”. This will add a regular and an Italic version of the Meslo font.

3.3 Select the font in the Terminal’s Theme

Remember we added “Solarized Dark” theme in Step 1? That didn’t have any fonts in it and MacOS had some default font. All we need to do is to set our Meslo dotted font for this theme and we are done!

  1. Open Terminal > Preferences > Text
  2. Select Solarized Dark ansi Theme
  3. Click on the “Font” button — This opens up “Fonts” dialog
  4. In the “Fonts” dialog, select “Meslo LG L DZ for Powerline” in the Family and also select font size 14 (so it’s easier to read).

3.4 Restart Terminal

Completely quit the Terminal (Terminal > Quit Terminal) and then reopen it.

Step 4 — Adding Git information to the prompt

Afin d'afficher divers statuts Git à l'invite, nous devons installer powerline-gitstatus. Il s'agit d'un simple complément à Powerline et ajoute plusieurs couleurs et thèmes pour afficher diverses informations sur l'état de git.

4.1 Installer powerline-gitstatus

pip install --user powerline-gitstatus
Remarque: la commande «- user» est nécessaire pour l'installer dans le profil de l'utilisateur.

4.2 Ajouter des schémas de couleurs Powerline-gitstatus à Powerline

4.2.1 Ouvrez le colorschemes/shell/default.jsondossier suivant

${powerline-install-directory}/powerline/config_files/colorschemes/shell/default.json //For example: /Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/config_files/colorschemes/shell/default.json

4.2.2 Ajoutez les couleurs suivantes:

Comme mentionné dans le fichier readme de powerline-gitstatus. PS: Copiez simplement les couleurs à l'intérieur des «groupes» et ajoutez-les ensuite au default.json comme indiqué ci-dessous.

Voici mes schémas de couleurs default.json (vous pouvez copier et coller ceci à la place):

{ "name": "Default color scheme for shell prompts", "groups": { "hostname": { "fg": "brightyellow", "bg": "mediumorange", "attrs": [] }, "environment": { "fg": "white", "bg": "darkestgreen", "attrs": [] }, "mode": { "fg": "darkestgreen", "bg": "brightgreen", "attrs": ["bold"] }, "attached_clients": { "fg": "white", "bg": "darkestgreen", "attrs": [] }, "gitstatus": { "fg": "gray8", "bg": "gray2", "attrs": [] }, "gitstatus_branch": { "fg": "gray8", "bg": "gray2", "attrs": [] }, "gitstatus_branch_clean": { "fg": "green", "bg": "gray2", "attrs": [] }, "gitstatus_branch_dirty": { "fg": "gray8", "bg": "gray2", "attrs": [] }, "gitstatus_branch_detached": { "fg": "mediumpurple", "bg": "gray2", "attrs": [] }, "gitstatus_tag": { "fg": "darkcyan", "bg": "gray2", "attrs": [] }, "gitstatus_behind": { "fg": "gray10", "bg": "gray2", "attrs": [] }, "gitstatus_ahead": { "fg": "gray10", "bg": "gray2", "attrs": [] }, "gitstatus_staged": { "fg": "green", "bg": "gray2", "attrs": [] }, "gitstatus_unmerged": { "fg": "brightred", "bg": "gray2", "attrs": [] }, "gitstatus_changed": { "fg": "mediumorange", "bg": "gray2", "attrs": [] }, "gitstatus_untracked": { "fg": "brightestorange", "bg": "gray2", "attrs": [] }, "gitstatus_stashed": { "fg": "darkblue", "bg": "gray2", "attrs": [] }, "gitstatus:divider": { "fg": "gray8", "bg": "gray2", "attrs": [] } }, "mode_translations": { "vicmd": { "groups": { "mode": { "fg": "darkestcyan", "bg": "white", "attrs": ["bold"] } } } } }

4.3 Activer le thème

4.3.1 Ouvrir le fichier default.json du thème

${powerline-install-directory}/powerline/config_files/themes/shell/default.json //For example: /Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/config_files/themes/shell/default.json

4.3.2 Ajoutez ce qui suit à default.json

{ "function": "powerline_gitstatus.gitstatus", "priority": 40 }

Vous trouverez ci-dessous le thème default.json de mon Powerline (vous pouvez copier et coller ceci à la place):

Remarque: J'ai tout supprimé de la section «droite» et également supprimé le «numéro de travail» («jobnum») pour garder les choses propres. Sinon, vous verrez un petit artefact sur le bord droit de l'invite.
{ "segments": { "left": [{ "function": "powerline.segments.shell.mode" }, { "function": "powerline.segments.common.net.hostname", "priority": 10 }, { "function": "powerline.segments.common.env.user", "priority": 30 }, { "function": "powerline.segments.shell.cwd", "priority": 10 }, { "function": "powerline_gitstatus.gitstatus", "priority": 40 } ], "right": [] } }

4.4 Redémarrez le démon

Enregistrez le fichier et exécutez ce qui suit: powerline-daemon —-replacedans le terminal.

Remarque importante: Chaque fois que vous apportez des modifications à la configuration de lignes sous tension, en plus de redémarrer le terminal, vous aurez également besoin de redémarrer le démon pour visualiser les modifications en cours d' exécution: powerline-daemon —-replace.

4.5 Redémarrer le terminal

Quittez le terminal (Terminal> Quitter le terminal) et ouvrez-le à nouveau.

À ce stade, nous avons tous terminé! ouf! Si vous ouvrez le Terminal, accédez à n'importe quel référentiel git et jouez, cela devrait ressembler à ce qui suit.

Voici à quoi cela ressemble dans le thème Solarized-Light:

Here is how it looks in Cobalt2 Theme:

?? Thank you!

If you have questions, please feel free to ask me on Twitter: //twitter.com/rajaraodv

If this was useful, please click the clap ? button down below a few times to show your support! ⬇⬇⬇ ??

My Other Posts

//medium.com/@rajaraodv/latest

ECMAScript 2015+

  1. Check out these useful ECMAScript 2015 (ES6) tips and tricks
  2. 5 JavaScript “Bad” Parts That Are Fixed In ES6
  3. Is “Class” In ES6 The New “Bad” Part?

Terminal Improvements

  1. How to Jazz Up Your Terminal — A Step By Step Guide With Pictures
  2. Jazz Up Your “ZSH” Terminal In Seven Steps — A Visual Guide

WWW

  1. A Fascinating And Messy History Of The Web And JavaScript

Virtual DOM

  1. Inner Workings Of The Virtual DOM

React Performance

  1. Two Quick Ways To Reduce React App’s Size In Production
  2. Using Preact Instead Of React

Functional Programming

  1. JavaScript Is Turing Complete — Explained
  2. Functional Programming In JS — With Practical Examples (Part 1)
  3. Functional Programming In JS — With Practical Examples (Part 2)
  4. Why Redux Need Reducers To Be “Pure Functions”

WebPack

  1. Webpack — The Confusing Parts
  2. Webpack & Hot Module Replacement [HMR] (under-the-hood)
  3. Webpack’s HMR And React-Hot-Loader — The Missing Manual

Draft.js

  1. Why Draft.js And Why You Should Contribute
  2. How Draft.js Represents Rich Text Data

React And Redux :

  1. Step by Step Guide To Building React Redux Apps
  2. A Guide For Building A React Redux CRUD App (3-page app)
  3. Using Middlewares In React Redux Apps
  4. Adding A Robust Form Validation To React Redux Apps
  5. Securing React Redux Apps With JWT Tokens
  6. Handling Transactional Emails In React Redux Apps
  7. The Anatomy Of A React Redux App
  8. Why Redux Need Reducers To Be “Pure Functions”
  9. Two Quick Ways To Reduce React App’s Size In Production

If this was useful, please share it! Thank you! ??