Windows 11

2021.08.09

WSL上のDocker Composeで作成したコンテナに、Windows 11ホストから接続する

こんにちは、ウチイダです。

ここしばらく、Windwos 11のWSL Ubuntu での環境構築を進めてきました。

前回の記事で、Docker Composeのインストールを紹介しています。

Windows 11 のWSL2(Ubuntu 20.04)にDocker Composeをインストールする

今回はその続きとして、シンプルなPHP開発環境をDocker Compose を用いて作成し、Windows ホストのブラウザからアクセスできるように設定していきます。

これができると、ついにWindows 11でWSLを使った実用的なWeb開発ができるようになります。

なお、動作環境は以下の通りです。

Windwos 11 Pro (21H2 ビルド 22000.120)
WSL カーネルバージョン: 5.10.16
Windows Terminal バージョン: 1.9.1942.0
Docker バージョン 20.10.8, build 3967b7d
Docker Compose バージョン 1.29.2, build 5becea4c

前準備①：Docker デーモンを起動する

WSLのディストリビューションは、サービスの自動起動などを行いません。

WSLを起動した後、最初にDockerを利用する場合は、デーモンを起動するのを忘れないようにしましょう。

$ sudo service docker start
[sudo] password for y-uchiida:
 * Starting Docker: docker                                 [ OK ]

## Docker デーモンの起動を確認します
$ service docker status
 * Docker is running

前準備②：開発環境をつくるディレクトリを作成

続いて、Docker に関するファイルや、PHPなどのスクリプトを置くディレクトリを作成します。

例として、「sample_docker-compose_on_wsl」を作成します。

また、PHPやJavaScriptなどのデータを置くための「public」も作成しておきます。

## とりあえずホームディレクトリに作ることにします
## 開発環境をまとめておく場所を決めている方は、そちらに作成してください
$ mkdir ~/sample_docker-compose_on_wsl

## 公開用ファイルを設置するpublic ディレクトリを作成します
$ mkdir ~/sample_docker-compose_on_wsl/public

前準備③：ファイル編集とDocker実行の準備

この後の作業で、yamlファイルを編集したりdocker-compose コマンドを実行したりするので、作成した開発環境用のディレクトリに移動しておきます。

また、エディタも用意します。以下の例では、VS Codeでsample_docker-compose_on_wsl ディレクトリを開いています。

## docker-compose コマンドを使うので、カレントディレクトリを移動しておきます
$ cd ~/sample_docker-compose_on_wsl

## Visual Studio Code(VS Code) を利用している方は、code コマンドでVS Codeで開くことができます
## docker-compose.ymlの編集などはVS Code
$ code .

docker-compose.ymlを作成する

準備が整いましたので、Docker Compose でコンテナを生成・起動するためのファイル docker-compose.ymlを作っていきます。

sample_docker-compose_on_wsl ディレクトリ配下に作成します。

完成コードは以下です。

ディスク容量を圧迫しないように、alpine ベースのイメージを選択しました。

version: '3.8' # 現時点での最新のバージョンを指定しておきます
services: 

  # Webサーバとして、nginx を利用します
  web: 
    container_name: "web"
    image: nginx:1.21.1-alpine
    ports:
      - "8080:80" # ポート8080を、ポート80 へフォワーディングします
    links:
      - app # php 実行コンテナ(app)に接続できるようにします
    volumes:
      - ./public:/var/www/public # WSL側のpublic ディレクトリを、web コンテナにマウントします
      - ./default.conf:/etc/nginx/conf.d/default.conf # nginx の設定ファイルを、web コンテナにマウントします

  app:
    container_name: "app"
    image: php:7.4-fpm-alpine3.14
    volumes:
      - ./public:/var/www/public # web コンテナと同じパスにアクセスできるように、app コンテナにもpublic ディレクトリをマウントします

ここでのポイントは2点あります。

ひとつは、links でweb コンテナから app コンテナに接続できるように設定したことです。

これにより、phpファイルが呼び出された際にapp コンテナへ処理を引き渡すことができるようになります。

もうひとつは、web と app の両方の volumes に./publicをマウントするように記述したことです。

同じファイルパスで参照できるようになるので、スムーズに処理の引き渡しができます。

コンテナにマウントするファイルを作成する

続いて、コンテナにマウントするファイルを作っていきます。

最低限の用意として、2つのファイルを作成します。

phpの処理をapp コンテナに引き渡すための設定を記述したnginxのconfigファイル「default.conf」と、publicルートにアクセスした際に処理される「index.php」です。

default.confの作成

まずは、nginxの設定ファイルから見ていきます。

sample_docker-compose_on_wsl ディレクトリの直下に、以下のdefault.conf を作成してください。

server {
    listen 80;
    server_name localhost;

    root /var/www/public;
    index index.php;

    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log;

    # PHP ファイルへアクセスされた場合に、app コンテナのfast CGIへ処理を回します
    location ~ \.php$ {
        include fastcgi_params;

        # app コンテナのポート9000でFast CGI がListenしているので、そちらへパスします
        fastcgi_pass app:9000;
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_index index.php;

        # nginx がアクセスされたファイルパスを、app コンテナで処理すべきファイルパスとして渡します
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        fastcgi_param PATH_INFO $fastcgi_path_info;

        try_files $uri = 404;
    }
}

ポイントは、 location ~ \.php のディレクティブです。

ここで、php ファイルにアクセスされた際にapp コンテナへ処理を移すための設定を記載しています。

app コンテナのポート9000でFast CGI がListenしているので、fastcgi_pass はapp:9000 を指定します。

また、SCRIPT_FILENAME で、nginx がアクセスされたファイルパス（$dcoument_root$fastcgi_script_name）を渡しています。

docker-compose.yml では、2つのコンテナにpublic ディレクトリを同じパスにマウントしました。

コンテナ同士のphpファイルのパスを一致させているため、このように記述できます。

index.php の作成

最後に、index.php を作成します。

これは、phpが動作していることが分かれば何でもよいです。

public ディレクトリ内に作成します。

<?php
    echo "hello from docker on wsl!!<br>\r\n";

内容は、好きなように設定してください。

コンテナの起動と動作確認

準備が整いましたので、docker コンテナを起動して動作を見ていきます。

まずはコンテナの起動です。

## dockerコンテナの起動には、sudo が必要になると思います
## コンテナ起動後にほかのコマンドを使いたいので、最後に & をつけてバックグラウンドで処理させます
$ sudo docker-compose up &
Creating app ... done
Creating web ... done
Attaching to app, web
app    | [09-Aug-2021 09:19:39] NOTICE: fpm is running, pid 1
app    | [09-Aug-2021 09:19:39] NOTICE: ready to handle connections
web    | /docker-entrypoint.sh: /docker-entrypoint.d/ is not empty, will attempt to perform configuration
web    | /docker-entrypoint.sh: Looking for shell scripts in /docker-entrypoint.d/
web    | /docker-entrypoint.sh: Launching /docker-entrypoint.d/10-listen-on-ipv6-by-default.sh
web    | 10-listen-on-ipv6-by-default.sh: info: Getting the checksum of /etc/nginx/conf.d/default.conf
web    | 10-listen-on-ipv6-by-default.sh: info: /etc/nginx/conf.d/default.conf differs from the packaged version
web    | /docker-entrypoint.sh: Launching /docker-entrypoint.d/20-envsubst-on-templates.sh
web    | /docker-entrypoint.sh: Launching /docker-entrypoint.d/30-tune-worker-processes.sh
web    | /docker-entrypoint.sh: Configuration complete; ready for start up
web    | 2021/08/09 09:19:40 [notice] 1#1: using the "epoll" event method
web    | 2021/08/09 09:19:40 [notice] 1#1: nginx/1.21.1
web    | 2021/08/09 09:19:40 [notice] 1#1: built by gcc 10.3.1 20210424 (Alpine 10.3.1_git20210424)
web    | 2021/08/09 09:19:40 [notice] 1#1: OS: Linux 5.10.16.3-microsoft-standard-WSL2
web    | 2021/08/09 09:19:40 [notice] 1#1: getrlimit(RLIMIT_NOFILE): 1048576:1048576
web    | 2021/08/09 09:19:40 [notice] 1#1: start worker processes
web    | 2021/08/09 09:19:40 [notice] 1#1: start worker process 32
web    | 2021/08/09 09:19:40 [notice] 1#1: start worker process 33
web    | 2021/08/09 09:19:40 [notice] 1#1: start worker process 34
web    | 2021/08/09 09:19:40 [notice] 1#1: start worker process 35

コンテナ起動時のメッセージがたくさん出ます。最後にstart worker process (番号) と表示されれば成功です。

コンテナの起動コマンドの最後に「&」をつけておくと、コンテナの起動がバックグラウンドで処理されます。

バックグラウンド処理にしておくことで、up コマンド実行後も同じターミナルで別のコマンドが実行できます。

WSLからコンテナにアクセス

まずはDocker コンテナのホストであるWSL から、コンテナへアクセスしてみます。

8080ポートをフォワーディングしているので、localhost:8080でコンテナ内のnginxへアクセスできます。

curl コマンドを用いて、レスポンスを確認します。

$ curl http://localhost:8080/
hello from docker on wsl!!<br>
app    | 172.22.0.3 -  09/Aug/2021:10:07:27 +0000 "GET /index.php" 200
web    | 172.22.0.1 - - [09/Aug/2021:10:07:27 +0000] "GET / HTTP/1.1" 200 43 "-" "curl/7.68.0"

index.php でechoした文字列「hello from docker on wsl!!」が表示されています。

また、web コンテナ、app コンテナそれぞれがメッセージを出してきました。

このような表示になれば、うまく設定できています。

index.php の内容を変更・保存し、再度curl コマンドを実行すると、表示内容が変わります。

Windows ホストのブラウザからコンテナにアクセス

最後に、Windows上のブラウザからコンテナにアクセスしてみます。

以前はWindows ホストからWSLにアクセスするには設定が必要だったのですが、今ではとくに何もしなくてもよいようです。

ブラウザを開き、localhost:8080にアクセスしてみます。

あっさり接続できてしまいました。

WSLのDockerで、こんなに簡単にPHP開発環境が作れるとは驚きです。

Docker コンテナを終了する

一通り動作確認をしたら、Docker コンテナを終了します。

$ sudo docker-compose down
Stopping web ...
Stopping app ...
web    | 2021/08/09 10:45:04 [notice] 1#1: signal 3 (SIGQUIT) received, shutting down
web    | 2021/08/09 10:45:04 [notice] 33#33: gracefully shutting down
web    | 2021/08/09 10:45:04 [notice] 34#34: gracefully shutting down

... 中略 ...

Removing web ... done
Removing app ... done
Removing network sample_docker-compose_default
[1]+  Done                    sudo docker-compose up

またコンテナにアクセスしたい場合は、 docker-compose up を実行してください。

まとめ：WSLでも、スムーズにPHP開発環境が構築できるようになりました

今回はこれで終了です。

2021年8月時点では、とても簡単にWSLを使ったPHP開発環境が構築できるようになっていました。感動。

Docker Compose を使いたかったので長くなってしまいましたが、Windows ホストからWSL 上のDocker コンテナにつなげるだけだったら、もっと簡単にできそうです。

PHP のほかにも、node.js やPython の環境も、同じ要領で構築できそうです。

ここから先はDocker の領域に入っていきますので、Docker に関する情報などをあたってみるとよいかと思います。

以上、あなたのお役に立てれば幸いです。

2021.08.09

Windows 11 のWSL2(Ubuntu 20.04)にDocker Composeをインストールする

こんにちは、ウチイダです。

前回のDocker インストールに引き続き、Windows 11のWSL2にDocker Composeをインストールして、開発環境を分割しやすくしていきます。

Windows 11 のWSL2(Ubuntu 20.04)にDockerをインストールする

WSL2 のUbuntu上に、Docker がインストールされている前提で手順を見ていきます。

なお、動作環境は以下の通りです。

Windwos 11 Pro (21H2 ビルド 22000.120)
WSL カーネルバージョン: 5.10.16
Windows Terminal バージョン: 1.9.1942.0

GitHub リポジトリから、Docker Composeの最新版をインストール

Docker Composeは、aptなどのパッケージ管理ツールからインストールできないようです。

公式サイトの記載に従って、最新版のリリースをcurlで取得します。

https://github.com/docker/compose/releases

2021年8月時点の最新版は、1.29.2 です。

## GitHubでの最新リリースのバージョン番号を指定してバイナリを取得
$ sudo curl -L https://github.com/docker/compose/releases/download/1.29.2/docker-compose-`uname -s`-`uname -m` -o /usr/local/bin/docker-compose

## ダウンロードしたバイナリに、実行権限を付与
$ sudo chmod +x /usr/local/bin/docker-compose

## バージョン情報を表示して、インストールされたかを確認する
$ docker-compose --version
docker-compose version 1.29.2, build 5becea4c

Docker Composeのコマンド補完をインストール

続いて、公式サイトにオプションとして記載されているコマンド補完機能を導入します。

docker-compose と入力した後にTab キーを押すと、利用できるサブコマンドが表示されたりと、非常に快適になります。

## コマンドライン補完のスクリプトをインストール
$ curl -L https://raw.githubusercontent.com/docker/compose/$(docker-compose version --short)/contrib/completion/bash/docker-compose > /etc/bash_completion.d/docker-compose

## ウチイダの場合、直接 /etc/bash_completion.d/ にファイルを置こうとするとうまくいかなかったので、以下のコマンドで行いました
$ curl -L https://raw.githubusercontent.com/docker/compose/$(docker-compose version --short)/contrib/completion/bash/docker-compose > ~/docker-compose
$ chmod 0644 ~/docker-compose
$ sudo root:root ~/docker-compose
$ sudo mv ~/docker-compose /etc/bash_completion.d

## シェルを再読み込み
$ exec $SHELL -l

## docker-compose のコマンド補完が動作することを確認
$ docker-compose [Tab キーを2回押す]
build    create   events   help     kill     pause    ps       push     rm       scale    stop     unpause  version
config   down     exec     images   logs     port     pull     restart  run      start    top      up

以上で、インストール作業は完了です。

次回はWeb開発のための環境を、Docker Compose で動かしてみることにします。

以上、あなたのお役に立てればうれしいです。

2021.08.09

Windows 11 のWSL2(Ubuntu 20.04)にDockerをインストールする

こんにちは、ウチイダです。

前回の記事で、Windows TerminalからWSLを使いやすくする設定を行いました

Windows Terminal起動時にWSLが開くようにする設定と、カラープロファイルを設定しただけですが。。。

ですがこれだけの設定で、WSLを使いたくなったらWindows キーでスタートメニューを開いて、「wt」と入力した後エンターを押すだけで、視認性の高いUbuntuのターミナルが表示できるようになりました。

前回の記事はこちら。

Windows 11のWindows Terminal設定

さて今回は、WSL2 のUbuntu にDocker をインストールしていきます。

前提となる動作環境は以下の通りです。

Windwos 11 Pro (21H2 ビルド 22000.120)
WSL カーネルバージョン: 5.10.16
Windows Terminal バージョン: 1.9.1942.0

Docker 公式ドキュメントによると、リポジトリからインストールするのがおすすめの方法ということです。

https://docs.docker.com/engine/install/ubuntu/#install-using-the-repository

上記のページの手順に沿って、作業を進めていきます。

インストール前の準備

とりあえず、パッケージをアップデートして最新の状態にしましょう。

$ sudo apt-get update
$ sudo apt-get upgrade

続いて、リポジトリをHTTPS経由で利用できるようにするためのパッケージをインストールします。

$ sudo apt-get install \
  apt-transport-https \
  ca-certificates \
  curl \
  gnupg \
  lsb-release

Docker のリポジトリを利用するために、GPG鍵を追加します。

正直、この辺よくわかっていません。。。セキュリティのための必要事項だ、くらいの雑な理解をしています。

$ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg

前準備の最後の手順です。Docker リポジトリ（安定版、Stable）を追加します。

$ echo "deb [arch=amd64 signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

Dockerのインストールと動作確認

追加したリポジトリから、Docker エンジンをインストールします。

$ sudo apt-get update
$ sudo apt-get install docker-ce docker-ce-cli containerd.io

インストールできたか確認してみます。

$ docker --version
Docker version 20.10.8, build 3967b7d

バージョン情報が表示されれば、パッケージのインストールは成功です。

docker コマンドを実行する前に、Docker デーモンを起動しておきます。

$ sudo service docker start
 * Starting Docker: docker

## 起動確認
$ sudo service docker status
 * Docker is running

ちなみに、サービスを起動し忘れてDockerコマンドを実行すると、以下のようなエラーが出ます。

docker: Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running?.

Docker デーモンが起動できたら、ようやく動作確認です。hello-world コンテナを動かしてみます。

$ sudo docker run hello-world
Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world
b8dfde127a29: Pull complete
Digest: sha256:df5f5184104426b65967e016ff2ac0bfcd44ad7899ca3bbcf8e44e4461491a9e
Status: Downloaded newer image for hello-world:latest

Hello from Docker!
This message shows that your installation appears to be working correctly.

To generate this message, Docker took the following steps:
 1. The Docker client contacted the Docker daemon.
 2. The Docker daemon pulled the "hello-world" image from the Docker Hub.
    (amd64)
 3. The Docker daemon created a new container from that image which runs the
    executable that produces the output you are currently reading.
 4. The Docker daemon streamed that output to the Docker client, which sent it
    to your terminal.

To try something more ambitious, you can run an Ubuntu container with:
 $ docker run -it ubuntu bash

Share images, automate workflows, and more with a free Docker ID:
 https://hub.docker.com/

For more examples and ideas, visit:
 https://docs.docker.com/get-started/

## 本当に実行できたのか、コンテナを確認します
$ sudo docker ps -a
CONTAINER ID   IMAGE         COMMAND    CREATED          STATUS                      PORTS     NAMES
f370ebbed892   hello-world   "/hello"   10 seconds ago   Exited (0) 24 seconds ago             goofy_gates

WSL上で、dockerコンテナを動かすことができました！

現在の状態では手動でDocker デーモンを起動する必要があり、最初に動かすときに手間がかかります。

WSLはSystemd が動いていないため、サービスの自動起動などができなくて不便ですね。

このあたりの解決方法はまた別の機会に。

今回の内容は以上です。

あなたのお役に立てればうれしいです。

2021.08.08

CドライブをWSLのルートディレクトリにマウントする

こんにちは、ウチイダです。

WSL設定、今回はUbuntu上でWindows ホストのデータにアクセスする設定です。

CドライブなどのWindows上のデータは、デフォルトではWSLの/mnt ディレクトリにマウントされています。

$ ll /mnt
total 8
drwxr-xr-x  7 root      root      4096 Aug  6 17:44 ./
drwxr-xr-x 19 root      root      4096 Aug  8 17:26 ../
drwxrwxrwx  1 y-uchiida y-uchiida  512 Aug  8 16:47 c/
drwxrwxrwx  1 y-uchiida y-uchiida 4096 Aug  5 20:14 d/
drwxrwxrwx  1 y-uchiida y-uchiida 4096 Aug  5 20:14 e/
drwxrwxrwt  2 root      root        60 Aug  8 17:26 wsl/
drwxrwxrwt  6 root      root       260 Aug  8 17:30 wslg/

ウチイダとしては、mntではなくルートにあったほうが違和感がないのです。

というわけで、Windows ホストのファイルシステムを、WSLのルートディレクトリにマウントする設定を行っていきます。

wsl.conf を作成する

WSLのディストリビューションの構成は、/etc/wsl.conf で設定することができます。

Windowsのドライブのマウント先も、ここに設定項目があります。

/etc/wsl.conf を作成し、以下のように入力します。

etc ディレクトリ上のファイルなので、 sudo コマンドなどでroot 権限を与えるのを忘れないようにしましょう。

# WSL(Ubuntu)のルートディレクトリに、Windowsのドライブ（C:とか）をマウントする
[automount]
enabled = true
root = /

これを保存します。

ディストリビューションを再起動する

設定を反映するために、Ubuntuを再起動します。

PowerShellで以下を実行します。

## ディストリビューション(Ubuntu)を停止
PS C:\> wsl --shutdown Ubuntu-20.04

## 停止していることを確認する
PS C:\> wsl -l -v
  NAME            STATE           VERSION
* Ubuntu-20.04    Stopped         2

ディストリビューションをいったん停止したら、Windows Teminalから該当のディストリビューションのターミナルを開きます。

この際に、起動を行ってくれます。

ターミナルが表示したら、ルートディレクトリにC: ドライブがマウントされていることを確認してみます。

$ ll /c
ls: cannot access '/c/DumpStack.log.tmp': Permission denied
ls: cannot access '/c/hiberfil.sys': Permission denied
ls: /c/MSOCache: Permission denied
ls: cannot access '/c/pagefile.sys': Permission denied
ls: /c/PerfLogs: Permission denied
ls: cannot access '/c/swapfile.sys': Permission denied
ls: '/c/System Volume Information': Permission denied
total 380
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  3 01:25 '$Recycle.Bin'/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  3 20:44 '$SysReset'/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  4 04:04 '$WinREAgent'/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  8 16:47  ./
drwxr-xr-x 24 root      root        4096 Aug  8 20:22  ../
-r-xr-xr-x  1 y-uchiida y-uchiida     30 Aug  5 19:36  AVScanner.ini*
lrwxrwxrwx  1 y-uchiida y-uchiida      8 Aug  2 21:57 'Documents and Settings' -> /c/Users/
-?????????  ? ?         ?              ?            ?  DumpStack.log.tmp
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  8 17:25  Intel/
d--x--x--x  1 y-uchiida y-uchiida    512 Sep 23  2018  MSOCache/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  3 04:08  OneDriveTemp/
d--x--x--x  1 y-uchiida y-uchiida    512 Jun  5 21:10  PerfLogs/
dr-xr-xr-x  1 y-uchiida y-uchiida    512 Aug  8 16:20 'Program Files'/
dr-xr-xr-x  1 y-uchiida y-uchiida    512 Aug  8 16:21 'Program Files (x86)'/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  8 16:21  ProgramData/
drwxrwxrwx  1 y-uchiida y-uchiida    512 Aug  2 21:48  Recovery/
d--x--x--x  1 y-uchiida y-uchiida    512 Aug  7 18:59 'System Volume Information'/
dr-xr-xr-x  1 y-uchiida y-uchiida    512 Aug  3 01:27  Users/
dr-xr-xr-x  1 y-uchiida y-uchiida    512 Aug  7 18:04  Windows/
dr-xr-xr-x  1 y-uchiida y-uchiida    512 Aug  3 00:06  WpSystem/
-r-xr-xr-x  1 y-uchiida y-uchiida 384322 Jul 16  2016  bootmgr*
-?????????  ? ?         ?              ?            ?  hiberfil.sys
-?????????  ? ?         ?              ?            ?  pagefile.sys
-?????????  ? ?         ?              ?            ?  swapfile.sys

Permission denied がいくつかありますが、Usersや ‘Program Files’が表示されています。

今回の内容は以上です。

これで、PowerShellなどWindows ホストのCLI環境に近づけることができました。

あなたのお役に立てればうれしいです。

2021.08.08

Windows 11のWindows Terminal設定

こんにちは、ウチイダです。

今回もWindows 11の環境構築についてです。

前回インストールしたWSLを、Windows Terminalから利用しやすくしていきます。

WSLのインストール手順は、以下の記事に書きました。

Windows 11にWSL Ubuntuをインストール

なお、この記事を作成している時点でのウチイダの環境は以下です。

Windwos 11 Pro (21H2 ビルド 22000.120)
WSL カーネルバージョン: 5.10.16
Windows Terminal バージョン: 1.9.1942.0

Windows Terminalの設定を変更する

以前はsetting.jsonを直接編集する必要がありましたが、現在では設定画面上から変更できる項目が増えました。

一般的な設定変更だけなら、jsonを開く必要はありませんでした。

1. デフォルトの起動プロファイルを変更する

Windows Terminal を起動した際に最初に開くプロファイルを、PowerShellからUbuntuに変更します。

Windows Terminal のタブ右端のにある「∨」をクリックして「設定」を開き、「既定のプロファイル」をUbuntuに変更します。

これで、Windows Terminalを起動した際にUbuntuがすぐに使えるようになります。

2. カラープロファイルを設定する

続いて、カラープロファイルを設定します。こちらも、設定画面上から変更できるようになっています。

設定画面で「Ubuntu」を選択し、「外観」タブの「配色」を選択します。

ウチイダはデフォルトの中の「One Half Dark」が気に入っているので、これに設定します。

設定画面右下の「保存」ボタンを押してから、Ubuntuのターミナルを開きなおすと、配色が変更されます。

LS_COLORSの設定を変更

One Half Darkを設定しておけば、おおむね見やすくてよいのですが、一部どうにも視認できないものがあります。

lsコマンドの出力の際、他ユーザーからの編集を許可しているファイルが緑背景に青文字になってしまい、とても読みづらいです。

とりあえずこの部分だけは、追加で変更していきます。

.dir_colors を作成して編集

ls コマンドの出力結果の色指定は、$LS_COLORSという環境変数で管理されているので、これを変更します。

dircolors コマンドで、現在の$LS_COLORSの設定値が出力されるので、まずはこれを.dircolors ファイルに保存します。

$ dircolors -p > ~/.dircolors

## ファイルを編集（vim）
$ vim ~/.dircolors

## Visual Studio Code がインストールされていれば、以下のコマンドでホームディレクトリを開くのもよいです
$ code ~

そして、.dircolors に記載されているOTHER_WRITABLE の設定を変更します。

今回は、文字色を黒に変えるだけにしておきます。

# ウチイダの環境では、60行目にありました
# 34;42 を 30;42 に変更します
OTHER_WRITABLE 30;42 # dir that is other-writable (o+w) and not sticky

利用できる色番号の一覧は、こちらのページの「ISO 6429 (ANSI) カラーシーケンス」に記載があります。

該当部分を引用しておきます。

0　デフォルトカラーを復元
1　より明るい色
4　下線付きのテキスト
5　点滅するテキスト
30　文字表示色：黒
31　文字表示色：赤
32　文字表示色：緑
33　文字表示色：黄 (または茶)
34　文字表示色：青
35　文字表示色：紫
36　文字表示色：シアン
37　文字表示色：白 (またはグレー)
40　背景色：黒
41　背景色：赤
42　背景色：緑
43　背景色：黄 (または茶)
44　背景色：青
45　背景色：紫
46　背景色：シアン
47　背景色：白 (またはグレー)
Man page of DIR_COLORS – linuxjm.osdn.jp

bashrsへの登録と設定反映

.dircolors の設定変更ができたら、.bashrcに以下のコマンドを追記し、起動時に.dircolorsの設定内容が反映されるようにします。

# 以下を追記する
eval $(dircolors -b ~/.dircolors)

ターミナルを起動しなおすか、 source ~/.bashrc を実行すると、設定が反映されます。

今回の内容は以上です。

dircolorsの設定もしたのでちょっと範囲が広くなりましたが、Windows TerminalからWSL を快適に使う最低限の設定をしました。

あなたのお役に立てればうれしいです。

2021.08.06

Windows 11にWSL Ubuntuをインストール

こんにちは、ウチイダです。

Windows 11での開発環境として、WSL をインストールしていきます。

最短の手順では、PowerShellでコマンドを2，3実行するだけです。

画像などを含めた詳細な内容は、別のブログで改めて紹介するかもしれません。

1. WSLの有効化

まずWSLを有効化します。管理者権限で実行したPowerShellターミナルから以下を実行。

Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

処理終了後、再起動します。

2. Ubuntuのインストール

次はwsl コマンドで、ディストリビューションのインストールを行います。

ここでは、Ubuntu-20.04を選択します。

PS C:\> wsl --install -d Ubuntu-20.04
ダウンロード中: Ubuntu 20.04 LTS
インストール中: Ubuntu 20.04 LTS
Ubuntu 20.04 LTS はインストールされました。
Ubuntu 20.04 LTS を起動しています...

ダウンロードに時間がかかるので、しばらく待ちます。

インストール処理終了後、ユーザー名入力のプロンプトが表示されたら完了です。

3. WSLのバージョンの確認・変更

Windows 11では、WSL2がデフォルトに設定されているようなので変更の必要はなさそうです。

以下のコマンドで確認ができます。

PS C:\> wsl -l -v
  NAME            STATE           VERSION
* Ubuntu-20.04    Stopped         2
PS C:\>

もしVERSION が1になっているようであれば、以下のコマンドでデフォルトの設定を変更できます。

PS C:\> wsl --set-default-version 2
WSL 2 との主な違いについては、https://aka.ms/wsl2 を参照してください
この操作を正しく終了しました。

インストール作業は以上です。

Ubuntuをセットアップしたら使い始められます。

あなたのお役に立てればうれしいです。

2021.08.06

Windows 11のPowerShellで日本語が文字化け→フォント変更で改善した

こんにちは。ウチイダです。

先日からWindows 11の設定作業をこまごまと進めているのですが、なぜかPowerShellの日本語部分が文字化けしてしまいました。

アイコンを右クリック＞管理者として実行　でも同じだったのですが、

Start-Process powershell.exe -Verb runas

で起動したターミナルは文字化けしていませんでした。

これをよくみると、なんだかフォントの形がちょっと違うんですよね…

ウィンドウ左上のアイコンをクリック＞プロパティ　を開いてみたところ、フォントの設定が「Consolas」になっていました。

ためしに「MS　ゴシック」に変更してみたら改善しました。

Consolasには、日本語が含まれていないのでしょうか。

そもそも初期インストールしたばかりで、設定を変えた覚えもないのですが…。

せっかくなので、Ricty Diminished をインストールしてPowerShellの規定フォントに設定しました。

フォントも少しだけ大きく。

Windows Terminal 経由でPowerShellも利用するので、色の設定などは行いませんでした。

以上です。あなたのお役に立てればうれしいです。

2021.08.03

Windows 11で、タスクバーを左端に配置する

こんばんは。ウチイダです。

Windows 11をインストールして使い始めていますが、どうにもタスクバーが中央配置になったことになれません。

従来通り、左端に配置するように設定を変えました。

スタートメニューから「設定」を起動
設定のウィンドウで、個人用設定 > タスクバーを開く
タスクバーの動作の設定項目で、配置を「左揃え」に変更

左寄せになりました。

ウチイダは基本的にカスタマイズをたくさんするのを好まないので、そのうち中央配置に直すかもしれません。

ですが、今はほかに慣れていかないといけないことが多いので、タスクバーの配置は従来と同じにしておきます。

以上です。あなたのお役に立てればうれしいです。

2021.08.03

Windows 10からアップデートしたPCに、Windows 11をクリーンインストールする

こんばんは。ウチイダです。

いよいよWindows 11がインサイダープログラムで流れてきました。

いまメインで使っているPCはマウスコンピュータのスリムタワーで、いくつかパーツを増強して使っています。

LUV MACHINES Slim LM-iHS320S Core i5/8GBメモリ/1TB HDD 搭載モデル – 価格.com

https://kakaku.com/item/K0000933246/

購入から4年が経過していて、古いデータが残っていることもあり動作が遅くなることがあります。

せっかくの機会なので、心機一転、クリーンインストールしてみたいと思います。

リセットで調子が戻れば、このままあと2，3年は使いたいですね。お金ないので。笑

データのバックアップをしっかり取って、Windows 10の環境は別のPCで用意しておきます。

後戻りできない可能性が高いので、試される場合は自己責任でお願いします。

クリーンインストールの手順

以下の手順でクリーンインストールをおこないました。簡単です。

1. Windows Updateで、Windows 10 からWindows 11に更新

とりあえず、まずはWindows 11にアップデートしましょう。結構時間がかかります。

2. 更新後、スタートメニューから「設定」を起動

管理回りはそれほど変わっておらず、Windows 10とほぼ同じです。

まずはWindowsキーを押してスタートメニューを表示し、「設定」を開きます。

3. 設定のウィンドウで、システム > 回復へ移動

設定のウィンドウの画面左にメニュー項目が並んでいるので、そこから「システム」を選択します。

画面右側のシステム関連の設定項目の中に「回復」があるので、そちらを開きます。

4. 「PCをリセットする」をクリック

「回復」の画面を開くと、「回復オプション」に「このPCをリセット」があります。

「PCをリセットする」をクリックして、リセットの設定ウィンドウを開きます。

5. 削除オプションで、「すべて削除する」を選択する

リセットの設定ウィンドウが表示されたら、個人用ファイルを残すかどうかを選択します。

必要なデータは別のドライブに退避する前提で、「すべて削除する」を選択します。

バックアップ漏れが心配な場合は、「個人用ファイルを保持する」を選択するほうが良いかもしれません。

6. 再インストールの方法で、「クラウドからダウンロード」を選択する

次に、再インストール方法を選択します。今回は「クラウドからダウンロード」を選択しました。

「ローカル再インストール」の場合、10と11のどっちでインストールされるかわからなかったので…

7. 「追加の設定」が表示されるので、必要に応じて変更

ドライブのクリーニングをするかどうか、システムドライブ以外もデータ削除するかを決めます。

ウチイダはドライブクリーニングなし、システムドライブのみ削除を選択しました。

8. リセットの設定内容を確認し、「リセット」ボタンをクリックする

追加の設定が終わったら、リセットの設定は以上です。

さいごに確認画面が出てくるので、「リセット」ボタンをクリックしましょう。

インストール用のデータをダウンロードされ、初期化の動作が始まります。

しばらくすると再起動され、Windows 11の初期セットアップ画面が表示されます。

9. リセット終了後、初期セットアップを行う

Windows 11の初期セットアップを行います。画面のデザインや見栄えは変わりましたが、
設定項目自体はWindows 10のときとほぼ変わっていないので、初期設定を行ったことがあれば大丈夫のはずです。

Windows 10では初期セットアップ時にコンピュータ名を勝手に設定されてしまっていたのですが、Windows 11では
初期設定の際に決めることができるようになっていたのが地味にうれしいです。

セットアップ完了後に、設定から直して再起動するのが面倒だったので…

リセット後のシステム状況

全データをまるごと削除したので、だいぶ軽くなりました。

ブラウザやセキュリティソフト、Slackなどのメッセージングアプリなど、いくつかのソフトウェアを入れた後の状態で、ディスク容量が45.3GBです。

もともと300GBくらい使っていたので、ここからどのくらいデータが膨らむかわかりませんが…

少なくとも現時点では軽快に動いています。

なお、PCの性能は以下のような感じです。

もともとWindows 11の動作要件に含まれておらず、あとから追加された第7世代Core i5 搭載です。

基本的な動作は、今のところ大丈夫そう。

この後、WSLなどのインストールを行って、プログラミング環境を整えていきます。

余談ですが、Windows terminalは初期インストールされていました。

42の課題とか、お仕事で引き受けている案件の開発ができるところまで設定出来たらまたまとめます。

あなたのお役に立てればうれしいです。

前準備①：Docker デーモンを起動する

前準備②：開発環境をつくるディレクトリを作成

前準備③：ファイル編集とDocker実行の準備

docker-compose.ymlを作成する

コンテナにマウントするファイルを作成する

default.confの作成

index.php の作成

コンテナの起動と動作確認

WSLからコンテナにアクセス

Windows ホストのブラウザからコンテナにアクセス

Docker コンテナを終了する

まとめ：WSLでも、スムーズにPHP開発環境が構築できるようになりました

GitHub リポジトリから、Docker Composeの最新版をインストール

Docker Composeのコマンド補完をインストール

インストール前の準備

Dockerのインストールと動作確認

wsl.conf を作成する

ディストリビューションを再起動する

Windows Terminalの設定を変更する

1. デフォルトの起動プロファイルを変更する

2. カラープロファイルを設定する

LS_COLORSの設定を変更

.dir_colors を作成して編集

bashrsへの登録と設定反映

1. WSLの有効化

2. Ubuntuのインストール

3. WSLのバージョンの確認・変更

クリーンインストールの手順

1. Windows Updateで、Windows 10 からWindows 11に更新

2. 更新後、スタートメニューから「設定」を起動

3. 設定のウィンドウで、システム > 回復へ移動

4. 「PCをリセットする」をクリック

5. 削除オプションで、「すべて削除する」を選択する

6. 再インストールの方法で、「クラウドからダウンロード」を選択する

7. 「追加の設定」が表示されるので、必要に応じて変更

8. リセットの設定内容を確認し、「リセット」ボタンをクリックする

9. リセット終了後、初期セットアップを行う

リセット後のシステム状況

カテゴリー

最近の投稿

アーカイブ

最近の投稿

最近のコメント

アーカイブ

カテゴリー

メタ情報