仕事

bashターミナルプロンプトの表示・色の変更

bashターミナルプロンプトの表示・色の変更

最初に

windowsに開発環境を作って行ってから、快適に開発の方を行えています!

前回から『windowsターミナルのカスタマイズ』から開発環境を整えていくことを行っているのですが、結構満足しています!

https://www.lecu1012.com/windows_terminal_customize/

前回の『windows ターミナルのカスタマイズ』の記事では既に少しだけbashプロンプトを弄っている状態で行っていたので、少し見やすい色合いになっていたかと思いますが、実際の初期の画面はこのようになっています!
(windows ターミナルのカスタマイズでのカラースキーム変更後の初期画面です!)



文字が青色で背景が黒になってて凄い見づらいですね!!

そして、ファイルパスが長くて、画面の半分まで埋まっています!


今回はこのbashプロンプトのカスタマイズを行っていきます!
主にカスタマイズしていく内容はこちら!

  • プロンプトの表示内容を変更
  • 表示内容の色を変更
  • Gitのブランチ情報を表示
  • 時刻での判定

とは言っても分かりづらいかと思うので、 先にカスタマイズ後の画面をご紹介!


Before


After


画面の半分が埋まっていた状態がだいぶんスッキリになりました!
色合いもだいぶん見やすくなったかと思います!

少し遠くで見づらいかと思うので近づけてみるとこんな感じです!



画面に表示内容はこちら!

白(背景赤):現在時刻
緑:現在のディレクトリ
黄:Gitのブランチ


入力した時間帯が分かるように現在時刻を出しているんですが、時間が10時~21時の間から外れた場合、背景が赤くなるようにしてみました!

最近、『気が付いたら夜遅くまで作業していた!?』ってことがあったりしたので、
少しでも時間に意識がいくように工夫してみた感じです!

簡単な説明を入れつつカスタマイズしていこうかと思いますが、
『説明なんぞいらねーぜ!!』って方は最後に『.bash_profile』の内容を
公開しておくのでコピーしてご利用ください!

では早速解説していきたいと思います(*’▽’)ノ

bash とは?

bash(Bourne Again Shell)とは、Linux標準で使われているshell(シェル)です。Linuxの操作は基本的にbashなどのshellを通して操作を行います。

『help』と打てばbashで利用できるコマンド一覧が表示されます!

bash以外にも『sh』『csh』『tcsh』『ksh』『zsh』などのshellがあります!
『現在利用しているshell』『利用可能なshell』は下記のコマンドで確認できます!

# 現在利用しているshellの確認
$ echo $SHELL
/bin/bash

# 利用可能なshell
$ cat /etc/shells
# /etc/shells: valid login shells
/bin/sh
/bin/bash
/usr/bin/bash
/bin/rbash
/usr/bin/rbash
/bin/dash
/usr/bin/dash
/usr/bin/tmux
/usr/bin/screen

これまではデフォルトが『bash』なので、使われることが多かったですが、『bash』の上位互換である『zsh』を使われることも多いです。macOSではCatalinaから『zsh』が標準になっているので、今後は『zsh』を利用する方も増えてくるのではないかと思います!

『zsh』はインストールが必要になってくるので、今回はLinux標準で使われている『bash』のプロンプトを編集して行こうかと思います!
(『zsh』に関してもまた書きますね!(*’▽’)ノ)

ちなみに先ほどから当たり前のように使っている『プロンプト』とは、
ターミナルの入力する場所の前に表示されているに情報のことです!



こちらの例で言えば、”$”以前の情報のことがプロンプトになります!


ではbashプロンプトの修正を行っていきましょう!(*’▽’)ノ

bash プロンプトを修正

設定ファイルを作成

bashのカスタマイズは主に、設定ファイル『.bashrc』『.bash_profile』を修正します。

ルートフォルダに設定ファイルを置いておけば、自動的に読み込んでくれますが、『.bash_profile』はログイン時のみ、『.bashrc』はシェル実行時ごとに読み込みます。

プロンプトの修正はログイン時のみで大丈夫まので、『.bash_profile』を修正します!
ルートの『.bash_profile』を修正しますが、設定ファイルがない方は下記のコマンドで作成していきましょう!

$ touch ~/.bash_profile

これで編集する準備が出来たので実際に修正していきます!

編集したい場合は”vim”や”VSCode”などのエディタを使って編集していきます!
vimは慣れが必要なエディタになるので、VSCodeで編集していきましょう!

コンソールで下記のコマンドを打つとVSCodeが立ち上がってくれます!

$ code ~/.bash_profile

プロンプトの表示内容を変更

プロンプトの表示内容は環境変数の”PS1″を編集することで編集することができます!
エディタを使って『.bash_profile』に下記の内容を追記してみて下さい!

内容を変更したらコンソールで『source ~/.bash_profile』と入力すると反映します!

.bash_profile
PS1="[\d \t] \W \$"
export PS1;
コンソールで入力
$ source ~/.bash_profile
【結果】

簡単に変更することが出来ましたね!
例で\d \t \W \$を使用しましたが、他にも様々な内容を表示できます!

\h ホスト名
\u ユーザー名
\w ディレクトリ(フルパス)
\W ディレクトリ
\t 時間 (24形式)
\T 時間 (12形式)
\@ AM / PM
\d 日付
\D 日時
\# コマンドの番号
\n 改行
\$ 一般ユーザーの時 $、rootの時 # を表示 $

これら内容以外でも任意の文字列を表示させることも可能なので、じゆと組み合わせて好みのプロンプトを作ってみて下さい!(*’▽’)ノ

表示内容の色を変更

では次に色の変更を行っていきましょう!

表示したい色を変更したい場合は、「エスケープシーケンス」を使って装飾の指定をしてあげると指定場所以降の文字の装飾が出来ます!色の変更だけでなく、太字や下線といった装飾も可能です!

例えばこちらを設定してみると、下記のようばプロンプトになります。

.bash_profile
PS1='装飾なし \[\e[4m\] 下線 \[\e[0m\] 装飾なし \$ ';
export PS1;
結果

\[\e[4m\]が『下線』の指定で、\[\e[0m\]が装飾をリセットするという指定になります。なので、\[\e[4m\]以降の『下線』というところだけ下線になっているのが分かるかと思います!

ちなみに\[\]で囲まれている箇所が「エスケープシーケンス」を使用するための宣言、\e[は『ASCIIのエスケープ文字を使うよ!』っていう意味で、実際に下線の指定をしているのは4m0mの箇所になります!

他にも何種類かの指定が可能です!

0m 装飾なし
1m 太字
2m 細字
3m イタリック体
4m 下線

同じ要領で文字や背景の色を変更することが可能です!


30m 黒文字
31m 赤文字
32m 緑文字
33m 黄文字
34m 青文字
35m 紫文字
36m 水文字
37m 白文字


40m 黒背景
41m 赤背景
42m 緑背景
43m 黄背景
44m 青背景
45m 紫背景
46m 水背景
47m 白背景


文字色と背景の両方変更したい場合など、複数組み合わせたい場合は;で区切ることで設定できます!こちらも試してみましょう!

.bash_profile
PS1='装飾なし \[\e[32m\] 緑文字 \[\e[31;42m\] 赤文字緑背景 \[\e[0m\] 装飾なし \$ ';
export PS1;
結果

これで色の変更もできました!

カラースキームによって色合いが異なるので、
ターミナルのカラーに合わせてカラー設定をしてみて下さい!(*’▽’)ノ

Gitのブランチ情報を表示

プロンプトの情報でよく利用されているのが、Gitのブランチ情報です!
何ブランチにいるかが分かることで、誤ったコミットを防ぐ目的ですね!

下記の関数を使うことで、ブランチ名の表示が可能です!

.bash_profile
prompt_git() {
	local branchName='';

	# ワークツリー内にいるか確認
	if [ $(git rev-parse --is-inside-work-tree &>/dev/null; echo $?) == '0' ]; then

		# branch名、またはhashの短縮表記を取得
		branchName="$(git symbolic-ref --quiet --short HEAD 2> /dev/null || \
			git rev-parse --short HEAD 2> /dev/null || \
			echo '(unknown)')";

		echo -e "${branchName}";
	else
		return;
	fi;
}

PS1="\$(prompt_git) \$";
export PS1;
結果

ちゃんとブランチが表示されました!

簡単に説明すると、下記のことをやっています!

  1. Gitのワークツリー内にいるかを確認
  2. ブランチ名、またはhashの短縮表記を取得して返却

特に難しいことはやっていなくて、簡単に言えば
git rev-parse --is-inside-work-treeの結果がTrueの場合、
git symbolic-ref --quiet --short HEADの結果を返却しています!

コマンドに関しては調べたら出てくるかと思うので、
気になった方は調べてみて下さい(*’▽’)ノ

時刻の判定

最後は時間の判定です!

現在時刻を取得して作業時間がオーバーしていたら、
背景が赤色に変わるように作成してみました!

.bash_profile
# 現在時刻を取得
time_now(){
    time=`date +%H%M`
    workStart=1000
    workEnd=2100

    if [ $workStart -lt $time -a $time -lt $workEnd ]; then
        echo -e "\e[0;37m[$(date '+%r')]"
	else
        echo -e "\e[41m[$(date '+%r')]"
    fi;
}

PS1="\$(time_now)";
export PS1;
結果

少し無理やり時刻を修正して色が変わるようにしましたが、
実際には21時を超えると赤色になるようにしています!

このように、プロンプトの表示にも簡単なプログラミングを加えることもできるので、
結構自由に表示を変えることができます!

是非、色々と試してみて下さい!(*’▽’)ノ

プロンプトの編集完了!

これらの内容を少しだけ応用して、プロンプトの編集が完了しました!
下記に作成した内容を公開しておくので、良かったら使って下さい(*’▽’)ノ

.bash_profile
# Color定義
txtblk='\e[0;30m' # Black - Regular
txtred='\e[0;31m' # Red
txtgrn='\e[0;32m' # Green
txtylw='\e[0;33m' # Yellow
txtblu='\e[0;34m' # Blue
txtpur='\e[0;35m' # Purple
txtcyn='\e[0;36m' # Cyan
txtwht='\e[0;37m' # White
bldblk='\e[1;30m' # Black - Bold
bldred='\e[1;31m' # Red
bldgrn='\e[1;32m' # Green
bldylw='\e[1;33m' # Yellow
bldblu='\e[1;34m' # Blue
bldpur='\e[1;35m' # Purple
bldcyn='\e[1;36m' # Cyan
bldwht='\e[1;37m' # White
unkblk='\e[4;30m' # Black - Underline
undred='\e[4;31m' # Red
undgrn='\e[4;32m' # Green
undylw='\e[4;33m' # Yellow
undblu='\e[4;34m' # Blue
undpur='\e[4;35m' # Purple
undcyn='\e[4;36m' # Cyan
undwht='\e[4;37m' # White
bakblk='\e[40m'   # Black - Background
bakred='\e[41m'   # Red
badgrn='\e[42m'   # Green
bakylw='\e[43m'   # Yellow
bakblu='\e[44m'   # Blue
bakpur='\e[45m'   # Purple
bakcyn='\e[46m'   # Cyan
bakwht='\e[47m'   # White
txtrst='\e[0m'    # Text Reset

# Gitのbranchを取得
prompt_git() {
	local branchName='';

	# ワークツリー内にいるか確認
	if [ $(git rev-parse --is-inside-work-tree &>/dev/null; echo $?) == '0' ]; then

		# branch名、またはhashの短縮表記を取得
		branchName="$(git symbolic-ref --quiet --short HEAD 2> /dev/null || \
			git rev-parse --short HEAD 2> /dev/null || \
			echo '(unknown)')";

		echo -e "${1}${branchName}";
	else
		return;
	fi;
}

# 現在時刻を取得
time_now(){
	time=`date +%H%M`
    workStart=1000
    workEnd=2100

    if [ $workStart -lt $time -a $time -lt $workEnd ]; then
        echo -e "${txtwht}[$(date '+%r')]"
	else
        echo -e "${bakred}[$(date '+%r')]"
    fi;
}

PS1="\$(time_now)";
PS1+="\[${txtgrn}\] \W"; # working directory
PS1+="\$(prompt_git \"\[${bldwht}\] on \[${txtylw}\]\")"; # Git repository details
PS1+="\[${txtwht}\] \$ \[${reset}\]"; # `

最初に

windowsに開発環境を作って行ってから、快適に開発の方を行えています!

前回から『windowsターミナルのカスタマイズ』から開発環境を整えていくことを行っているのですが、結構満足しています!

https://www.lecu1012.com/windows_terminal_customize/

前回の『windows ターミナルのカスタマイズ』の記事では既に少しだけbashプロンプトを弄っている状態で行っていたので、少し見やすい色合いになっていたかと思いますが、実際の初期の画面はこのようになっています!
(windows ターミナルのカスタマイズでのカラースキーム変更後の初期画面です!)



文字が青色で背景が黒になってて凄い見づらいですね!!

そして、ファイルパスが長くて、画面の半分まで埋まっています!


今回はこのbashプロンプトのカスタマイズを行っていきます!
主にカスタマイズしていく内容はこちら!

  • プロンプトの表示内容を変更
  • 表示内容の色を変更
  • Gitのブランチ情報を表示
  • 時刻での判定

とは言っても分かりづらいかと思うので、 先にカスタマイズ後の画面をご紹介!


Before


After


画面の半分が埋まっていた状態がだいぶんスッキリになりました!
色合いもだいぶん見やすくなったかと思います!

少し遠くで見づらいかと思うので近づけてみるとこんな感じです!



画面に表示内容はこちら!

白(背景赤):現在時刻
緑:現在のディレクトリ
黄:Gitのブランチ


入力した時間帯が分かるように現在時刻を出しているんですが、時間が10時~21時の間から外れた場合、背景が赤くなるようにしてみました!

最近、『気が付いたら夜遅くまで作業していた!?』ってことがあったりしたので、
少しでも時間に意識がいくように工夫してみた感じです!

簡単な説明を入れつつカスタマイズしていこうかと思いますが、
『説明なんぞいらねーぜ!!』って方は最後に『.bash_profile』の内容を
公開しておくのでコピーしてご利用ください!

では早速解説していきたいと思います(*’▽’)ノ

bash とは?

bash(Bourne Again Shell)とは、Linux標準で使われているshell(シェル)です。Linuxの操作は基本的にbashなどのshellを通して操作を行います。

『help』と打てばbashで利用できるコマンド一覧が表示されます!

bash以外にも『sh』『csh』『tcsh』『ksh』『zsh』などのshellがあります!
『現在利用しているshell』『利用可能なshell』は下記のコマンドで確認できます!

# 現在利用しているshellの確認
$ echo $SHELL
/bin/bash

# 利用可能なshell
$ cat /etc/shells
# /etc/shells: valid login shells
/bin/sh
/bin/bash
/usr/bin/bash
/bin/rbash
/usr/bin/rbash
/bin/dash
/usr/bin/dash
/usr/bin/tmux
/usr/bin/screen

これまではデフォルトが『bash』なので、使われることが多かったですが、『bash』の上位互換である『zsh』を使われることも多いです。macOSではCatalinaから『zsh』が標準になっているので、今後は『zsh』を利用する方も増えてくるのではないかと思います!

『zsh』はインストールが必要になってくるので、今回はLinux標準で使われている『bash』のプロンプトを編集して行こうかと思います!
(『zsh』に関してもまた書きますね!(*’▽’)ノ)

ちなみに先ほどから当たり前のように使っている『プロンプト』とは、
ターミナルの入力する場所の前に表示されているに情報のことです!



こちらの例で言えば、”$”以前の情報のことがプロンプトになります!


ではbashプロンプトの修正を行っていきましょう!(*’▽’)ノ

bash プロンプトを修正

設定ファイルを作成

bashのカスタマイズは主に、設定ファイル『.bashrc』『.bash_profile』を修正します。

ルートフォルダに設定ファイルを置いておけば、自動的に読み込んでくれますが、『.bash_profile』はログイン時のみ、『.bashrc』はシェル実行時ごとに読み込みます。

プロンプトの修正はログイン時のみで大丈夫まので、『.bash_profile』を修正します!
ルートの『.bash_profile』を修正しますが、設定ファイルがない方は下記のコマンドで作成していきましょう!

$ touch ~/.bash_profile

これで編集する準備が出来たので実際に修正していきます!

編集したい場合は”vim”や”VSCode”などのエディタを使って編集していきます!
vimは慣れが必要なエディタになるので、VSCodeで編集していきましょう!

コンソールで下記のコマンドを打つとVSCodeが立ち上がってくれます!

$ code ~/.bash_profile

プロンプトの表示内容を変更

プロンプトの表示内容は環境変数の”PS1″を編集することで編集することができます!
エディタを使って『.bash_profile』に下記の内容を追記してみて下さい!

内容を変更したらコンソールで『source ~/.bash_profile』と入力すると反映します!

.bash_profile
PS1="[\d \t] \W \$"
export PS1;
コンソールで入力
$ source ~/.bash_profile
【結果】

簡単に変更することが出来ましたね!
例で\d \t \W \$を使用しましたが、他にも様々な内容を表示できます!

\h ホスト名
\u ユーザー名
\w ディレクトリ(フルパス)
\W ディレクトリ
\t 時間 (24形式)
\T 時間 (12形式)
\@ AM / PM
\d 日付
\D 日時
\# コマンドの番号
\n 改行
\$ 一般ユーザーの時 $、rootの時 # を表示 $

これら内容以外でも任意の文字列を表示させることも可能なので、じゆと組み合わせて好みのプロンプトを作ってみて下さい!(*’▽’)ノ

表示内容の色を変更

では次に色の変更を行っていきましょう!

表示したい色を変更したい場合は、「エスケープシーケンス」を使って装飾の指定をしてあげると指定場所以降の文字の装飾が出来ます!色の変更だけでなく、太字や下線といった装飾も可能です!

例えばこちらを設定してみると、下記のようばプロンプトになります。

.bash_profile
PS1='装飾なし \[\e[4m\] 下線 \[\e[0m\] 装飾なし \$ ';
export PS1;
結果

\[\e[4m\]が『下線』の指定で、\[\e[0m\]が装飾をリセットするという指定になります。なので、\[\e[4m\]以降の『下線』というところだけ下線になっているのが分かるかと思います!

ちなみに\[\]で囲まれている箇所が「エスケープシーケンス」を使用するための宣言、\e[は『ASCIIのエスケープ文字を使うよ!』っていう意味で、実際に下線の指定をしているのは4m0mの箇所になります!

他にも何種類かの指定が可能です!

0m 装飾なし
1m 太字
2m 細字
3m イタリック体
4m 下線

同じ要領で文字や背景の色を変更することが可能です!


30m 黒文字
31m 赤文字
32m 緑文字
33m 黄文字
34m 青文字
35m 紫文字
36m 水文字
37m 白文字


40m 黒背景
41m 赤背景
42m 緑背景
43m 黄背景
44m 青背景
45m 紫背景
46m 水背景
47m 白背景


文字色と背景の両方変更したい場合など、複数組み合わせたい場合は;で区切ることで設定できます!こちらも試してみましょう!

.bash_profile
PS1='装飾なし \[\e[32m\] 緑文字 \[\e[31;42m\] 赤文字緑背景 \[\e[0m\] 装飾なし \$ ';
export PS1;
結果

これで色の変更もできました!

カラースキームによって色合いが異なるので、
ターミナルのカラーに合わせてカラー設定をしてみて下さい!(*’▽’)ノ

Gitのブランチ情報を表示

プロンプトの情報でよく利用されているのが、Gitのブランチ情報です!
何ブランチにいるかが分かることで、誤ったコミットを防ぐ目的ですね!

下記の関数を使うことで、ブランチ名の表示が可能です!

.bash_profile
prompt_git() {
	local branchName='';

	# ワークツリー内にいるか確認
	if [ $(git rev-parse --is-inside-work-tree &>/dev/null; echo $?) == '0' ]; then

		# branch名、またはhashの短縮表記を取得
		branchName="$(git symbolic-ref --quiet --short HEAD 2> /dev/null || \
			git rev-parse --short HEAD 2> /dev/null || \
			echo '(unknown)')";

		echo -e "${branchName}";
	else
		return;
	fi;
}

PS1="\$(prompt_git) \$";
export PS1;
結果

ちゃんとブランチが表示されました!

簡単に説明すると、下記のことをやっています!

  1. Gitのワークツリー内にいるかを確認
  2. ブランチ名、またはhashの短縮表記を取得して返却

特に難しいことはやっていなくて、簡単に言えば
git rev-parse --is-inside-work-treeの結果がTrueの場合、
git symbolic-ref --quiet --short HEADの結果を返却しています!

コマンドに関しては調べたら出てくるかと思うので、
気になった方は調べてみて下さい(*’▽’)ノ

時刻の判定

最後は時間の判定です!

現在時刻を取得して作業時間がオーバーしていたら、
背景が赤色に変わるように作成してみました!

.bash_profile
# 現在時刻を取得
time_now(){
    time=`date +%H%M`
    workStart=1000
    workEnd=2100

    if [ $workStart -lt $time -a $time -lt $workEnd ]; then
        echo -e "\e[0;37m[$(date '+%r')]"
	else
        echo -e "\e[41m[$(date '+%r')]"
    fi;
}

PS1="\$(time_now)";
export PS1;
結果

少し無理やり時刻を修正して色が変わるようにしましたが、
実際には21時を超えると赤色になるようにしています!

このように、プロンプトの表示にも簡単なプログラミングを加えることもできるので、
結構自由に表示を変えることができます!

是非、色々と試してみて下さい!(*’▽’)ノ

プロンプトの編集完了!

これらの内容を少しだけ応用して、プロンプトの編集が完了しました!
下記に作成した内容を公開しておくので、良かったら使って下さい(*’▽’)ノ

.bash_profile
(and reset color) export PS1;

他にもお勧めな内容があれば教えて頂けるとありがたいです!

最後に

今回はbashプロンプトのカスタマイズを行っていきました!
見た目もスッキリして、だいぶん使いやすくなったかと思います!

こういったターミナル周りをデフォルトで使っている方も多いですが、
色々とカスタマイズを出来て、自分好みのターミナルを作るのも楽しいものです!

良かったら皆さんも自分用のターミナルを作ってみて下さい!

今回もここまで見て頂いてありがとうございます!
次回もよろしくお願いします!

ABOUT ME
くり坊
Web系フリーランスエンジニア