👻

ターミナルのデザインをポケモンにする(Windows編)

に公開

ゴール

ターミナルをこんな感じのデザインにします。

alt text

やること

WindowsのマシンにHyperとhyper-pokemonを入れてセットアップする

1. Hyperとは?

Hyper は、Electronで開発されたカスタマイズ可能なターミナルです。
JavaScript/HTML/CSSを使って拡張やカスタマイズが容易にできるみたいです。

2. Hyperのインストール

2.1 Hyperのダウンロード

以下の公式サイトから最新のHyperをダウンロードします。

https://hyper.is/

2.2 Hyperのインストール

  1. ダウンロードした .exeファイルを実行します。
  2. インストールウィザードに従ってインストールを完了させます。
  3. インストールが完了したら、Hyperを起動して正しく動作するか確認します。

3. hyper-pokemonのインストール

Hyperを起動後、下記のコマンドを実行します。

hyper i hyper-pokemon

Ctrl + , のショートカットキーを叩くことで、Hyperの設定ファイル ~/.hyper.js を開きます。

つづいて、plugins の配列に "hyper-pokemon" を追加します。

module.exports = {
  config: {
    // 他の設定...
  },
  plugins: ["hyper-pokemon"],
};

config に以下を追加して、ポケモンテーマを変更できます。

module.exports = {
  config: {
    pokemon: 'random', // 他のポケモンに変更可能
    unibody: 'true', // ヘッダーと本体でデザインが区別できるようになります
    poketab: 'true', // タブに動くポケモンのアイコンが出現します。
    // 他の設定...
  },
  plugins: ["hyper-pokemon"],
};

適用できるポケモンのリストはGitHubリポジトリを参照してください。

5. 動作確認

Hyperを開き、テーマが適用されていることを確認してください。
テーマが正しく適用されていれば、セットアップ完了です!🎉

alt text

GitHubで編集を提案

Discussion