Zenn
🔥

Windowsで開発できるようにするまでの個人セットアップ

2022/07/27に公開
PowerShell
Windows
Starship
hyper
tech

はじめに

個人用です．もしかしたら誰かの役に立つかもくらいです．

見た目です．

OS をアップデートする．

以下のコマンドを打ちます．

terminal
winver

21H2よりもバージョンが低かったら，Windows Update を実行します．Windows -> 更新とセキュリティ -> Windows Update からアップデートする．以下の種々の操作で必要になります．

パッケージマネージャーをインストール

winget[1] を入れます．一括アップデートとかができて便利です．

install link

フォントをインストール(Cica)

お好みで等幅フォントをインストール．

僕は Cica が好きなので Cica を入れます．
Releases · miiton/Cica

Powershell(pwsh)をインストール

Powershell 7.x 系をインストール．

terminal
winget install --id Microsoft.Powershell --source winget

VSCode をインストール

terminal
winget install -e --id Microsoft.VisualStudioCode

画面右上の
をクリックして，プライマリサイドバーを右に変更します．サイドバーを開閉するときの視差を減らす目的です．

ターミナルエミュレーターをインストール(Hyper)

Hyper[2]を入れます．Alacritty[3] や Windows Terminal[4] なども候補に上がります．Hyper なのは，Windows Terminal は私用領域(PUA)の文字を半角で描画してしまい，Cica と相性が悪いからです．

terminal
winget install -e --id Zeit.Hyper

ターミナルを再起動して，Hyper のテーマを更新

terminal
hyper i hyper-material-theme

Hyper のシェルを pwsh にする．

terminal
code ~/AppData/Roaming/Hyper/.hyper.js

必要部分だけ抜き出します．

.hyper.js
module.exports = {
    config: {
        shell: 'C:\\Program Files\\PowerShell\\7\\pwsh.exe',
        shellArgs: [],
    }
}

環境変数として，Hyper のコンフィグのパスを登録しておくと便利です．

terminal
code $PROFILE
Microsoft.PowerShell_profile.ps1
$HYPER_CONFIG = "C:\Users\<user>\AppData\Roaming\.hyper.js

code $HYPER_CONFIG で設定ファイルを開けるようになります．

プロンプトをインストール(Starship)

terminal
winget install -e --id Starship.Starship
code $PROFILE

ファイル末尾になるように以下を追記します．この行以降に書き込まないでください．

Microsoft.PowerShell_profile.ps1
Invoke-Expression (&starship init powershell)

環境変数として，Starship のコンフィグのパスを登録しておくと便利です．

terminal
code $PROFILE
Microsoft.PowerShell_profile.ps1
$STARSHIP_CONFIG = "C:\Users\<user>\.config\starship.toml"

code $STARSHIP_CONFIG で設定ファイルを開けるようになります．
色々設定できるので，見てみてください[5]．Cica は各言語のロゴのフォントがあるので，それに置き換えると見やすくなります．

設定例

文字化けは，Cicaフォントの私用領域です．

starship.toml
[git_branch]
symbol = " "

[git_status]
conflicted = "="
ahead = "󿙂 "
behind = "󿘿 "
diverged = "󿩎 "
up_to_date = ""
untracked = "?"
stashed = "$"
modified = "!"
staged = "+"
renamed = "󿘽 "
deleted = "󿙕 "

[rust]
symbol = " "

[docker_context]
symbol = " "

[nodejs]
symbol = " "

[python]
symbol = " "

git

install

terminal
winget install -e --id Git.Git

ssh の設定

鍵を作成

terminal
ssh-keygen -t ed25519

クリップボードにコピー

terminal
Get-Content ~\.ssh\id_ed25519.pub | Set-Clipboard

SSH and GPG keysに，上で作ったキーを登録．

確認

terminal
ssh -T git@github.com

Tab で補完

posh-git をインストールします．インストールするか聞かれるのでYと答えます．

terminal
Install-Module posh-git

設定ファイルを VSCode で開きます．

terminal
code $PROFILE
Microsoft.PowerShell_profile.ps1
Import-Module posh-git

を書き込みます．

github-cli をインストール

プルリクエストの確認とかで便利なので．

terminal
winget install -e --id GitHub.cli
code $PROFILE

以下を追記します．

Microsoft.PowerShell_profile.ps1
Invoke-Expression -Command $(gh completion -s powershell | Out-String)

Docker のインストール

インストール

まず，WSL2 を導入します．マシンを再起動して，WSL2 のインストールを完了させます．

terminal
wsl --install

Docker をインストールします．

terminal
winget install -e --id Docker.DockerDesktop

Docker Desktop を起動して，歯車をクリックして，設定を行います．

2 つ目のチェックは，docker-composeをdocker composeに置き換えるためのものです．

Tab で補完

補完用のモジュールをインストールします．

terminal
Install-Module DockerCompletion -Scope CurrentUser
code $PROFILE

以下を追記します．

Microsoft.PowerShell_profile.ps1
Import-Module DockerCompletion

which コマンド

たまにほしいので追加します．

terminal
code $PROFILE
Microsoft.PowerShell_profile.ps1
function which ($command) {
    Get-command -Name $command -ShowCommandInfo | Format-List -Property Definition
}

参考[6]

キーバインドと入力候補補完を Zsh 風にする

pwsh[7]

設定ファイルに以下を追記します

terminal
code $PROFILE
Microsoft.PowerShell_profile.ps1
Import-Module PSReadLine

Set-PSReadLineKeyHandler -Key "Ctrl+d" -Function DeleteCharOrExit
Set-PSReadLineKeyHandler -Key "Ctrl+u" -Function BackwardDeleteLine
Set-PSReadLineKeyHandler -Key "Ctrl+k" -Function ForwardDeleteLine
Set-PSReadLineKeyHandler -Key "Ctrl+a" -Function BeginningOfLine
Set-PSReadLineKeyHandler -Key "Ctrl+e" -Function EndOfLine
Set-PSReadLineKeyHandler -Key "Ctrl+f" -Function ForwardChar
Set-PSReadLineKeyHandler -Key "Ctrl+b" -Function BackwardChar
Set-PSReadLineKeyHandler -Key "Alt+f" -Function NextWord
Set-PSReadLineKeyHandler -Key "Alt+b" -Function BackwardWord
Set-PSReadLineKeyHandler -Key "Ctrl+p" -Function PreviousHistory
Set-PSReadLineKeyHandler -Key "Ctrl+n" -Function NextHistory

Set-PSReadLineKeyHandler -Key "Tab" -Function MenuComplete

VSCode[8]

keybindings.json

VSCode 上でCtrl+Shift+Pを押下，> Preferences: Open Keyboard Shortcuts (JSON)をクリックして，以下の JSON を書き込みます．

keybindings.json
[
    {
        "key": "ctrl+d",
        "command": "deleteRight",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+h",
        "command": "deleteLeft",
        "when": "terminalFocus"
    }
    {
        "key": "ctrl+p",
        "command": "cursorUp",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+n",
        "command": "cursorDown",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+f",
        "command": "cursorRight",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+b",
        "command": "cursorLeft",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+a",
        "command": "cursorHome",
        "when": "terminalFocus"
    },
    {
        "key": "ctrl+e",
        "command": "cursorEnd",
        "when": "terminalFocus"
    }
]

Ctrl + T 相当の関数を知っている方がいたら教えてください．

pwsh コンフィグコピペ用

Microsoft.PowerShell_profile.ps1
Microsoft.PowerShell_profile.ps1
Import-Module posh-git
Import-Module DockerCompletion

Import-Module PSReadLine
Set-PSReadlineKeyHandler -Key "Ctrl+d" -Function DeleteCharOrExit
Set-PSReadLineKeyHandler -Key "Ctrl+u" -Function BackwardDeleteLine
Set-PSReadLineKeyHandler -Key "Ctrl+k" -Function ForwardDeleteLine
Set-PSReadLineKeyHandler -Key "Ctrl+a" -Function BeginningOfLine
Set-PSReadLineKeyHandler -Key "Ctrl+e" -Function EndOfLine
Set-PSReadLineKeyHandler -Key "Ctrl+f" -Function ForwardChar
Set-PSReadLineKeyHandler -Key "Ctrl+b" -Function BackwardChar
Set-PSReadLineKeyHandler -Key "Alt+f" -Function NextWord
Set-PSReadLineKeyHandler -Key "Alt+b" -Function BackwardWord
Set-PSReadLineKeyHandler -Key "Ctrl+p" -Function PreviousHistory
Set-PSReadLineKeyHandler -Key "Ctrl+n" -Function NextHistory

# Zsh like completion
Set-PSReadLineKeyHandler -Key "Tab" -Function MenuComplete

function which ($command) {
    Get-command -Name $command -ShowCommandInfo | Format-List -Property Definition
}

$HYPER_CONFIG = "C:\Users\<user>\AppData\Roaming\.hyper.js"
$STARSHIP_CONFIG = "C:\Users\<user>\.config\starship.toml"

Invoke-Expression -Command $(gh completion -s powershell | Out-String)
Invoke-Expression (&starship init powershell)
脚注

  1. winget ツールを使用したアプリケーションのインストールと管理 | Microsoft Docs ↩︎

  2. Hyper™ ↩︎

  3. alacritty/alacritty: A cross-platform, OpenGL terminal emulator. ↩︎

  4. Windows Terminal - Microsoft Store アプリ ↩︎

  5. 設定 | Starship ↩︎

  6. PowerShell で which コマンドを作る - Qiita ↩︎

  7. Powershell を bash 風のキーバインドにする ↩︎

  8. VScode のターミナルで、キーボードショートカットをストレスなく使う - Qiita ↩︎

Discussion