WSLからVSCodeを起動してシェルスクリプトを作成する場合の注意点

# はじめに

WSL (Windows Subsystem for Linux) を使ってVSCode (Visual Studio Code) でシェルスクリプトを作成する際、**文字コード**や**改行コード**が異なることで、Linux環境でスクリプトが正常に動作しない場合があります。このような問題を防ぐために、以下のポイントを押さえておきましょう。


# 文字コードの注意点

## 文字コードとは？

**文字コード**とは、私たちが普段使っている文字（ひらがな、カタカナ、アルファベット、数字など）をコンピュータが理解して処理できるように**数字（0と1）に変換するルール**のことです。コンピュータは文字そのものを理解することはできないため、文字を数字に置き換える必要があります。

文字コードは、文字を数字に変換するだけでなく、逆に数字を文字に戻す役割も果たします。このルールは、さまざまな言語や文字を扱うためにいくつか種類があります。主な文字コードには、Windowsでよく使われる**Shift_JIS**や、LinuxやMacで標準的に使われる**UTF-8**があります。

## 主な文字コードの種類

### ASCII（アスキー）
- **特徴**: アルファベットや数字、一部の記号を表現するための文字コード
- **範囲**: ASCIIコードは基本的に7ビットで構成され、0から127までの数値で文字を表す
- **例**:
    - `A` → 65
    - `B` → 66
    - `a` → 97
    - `1` → 49
- **問題点**: 英語しか表現できない

### **Shift_JIS（シフトジス）**
- **特徴**: 日本語を表現するために作られた文字コード
- **範囲**: ASCIIに加えて、日本語の「ひらがな」「カタカナ」「漢字」を表現可能
- **例**:
    - `あ` → 130, 129（2バイトで表現）
    - `漢` → 139, 103
- **問題点**: 他の国の文字を表現するのが難しい

### **UTF-8（ユーティーエフエイト）**
- **特徴**: 世界中のほとんどの文字を表現できる文字コード。現在の標準的な文字コード
- **範囲**: 英語は1バイト、日本語や中国語などは2～4バイトで表現
- **例**:
    - `A` → 65（1バイト）
    - `あ` → 227, 129, 130（3バイト）
- **メリット**: 世界中で使える統一規格
- **問題点**: 日本語だけを見ると、Shift_JISよりデータ量が大きくなる場合がある

## 文字コードが違うとどうなる？
**文字コードのルールが違うと、文字化けが発生**します。たとえば、あるファイルがShift_JISで保存されているのに、コンピュータがそのファイルをUTF-8として読み取ると、文字が正しく表示されません。

**例:**

- 本来の文字: `こんにちは`
- 誤って表示された文字: `ÊîÅñ`

これは、コンピュータが「違うルール」で数字を文字に変換してしまった結果です。

## **VSCodeでの文字コードの設定方法**

1. VSCodeでシェルスクリプトを開く。
2. 右下にある**文字コード**（`UTF-8` , `Shift_JIS`となっている）をクリック。
3. 「**エンコード付きで再度開く**」を選択し、文字コードを選びと選んだ文字コードになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3964643/2dcf724b-78a4-67f7-1479-a705edd5d423.png)


# **改行コードの注意点**

## **改行コードとは？**

**改行コード**は、「次の行に移動する」ことをコンピュータに伝える特別な文字です。

## 主な改行コードの種類

主な改行コードは以下の3種類です。

### LF (Unix系)

シンプルな設計を好むUnix文化では、改行はLFだけで十分とされました。現在はLinuxやMacで使われています。

### CR+LF (Windows)

初期のコンピュータはタイプライターの動きを再現する必要があり、「カーソルを戻す（CR）」と「次の行に送る（LF）」を組み合わせて使いました。その名残でWindowsはCR+LFを使い続けています。

### CR (古いMac)

古いMac OSでは、CRだけで改行を表現していました。しかし、現在のmacOSではUnix系と同じLFに変更されています。

## 改行コードの違いで起きる問題

**1. ファイルが正常に表示されない**

たとえば、Windowsで作ったテキストファイルをLinuxで開くと、改行されずにすべて1行に続いてしまうことがあります。

**2. スクリプトが動かない**

LinuxではLFを使うのが標準ですが、Windows形式のCR+LFが混ざっているとエラーになる場合があります。

**3. 文字化けに似た現象**

Windowsで作ったファイルをLinuxで開くと、余計な「^M」という文字が表示されることがあります（CRの部分がそのように見えるため）。

## **LinuxではLFを使う**

- WSLやLinuxでは、**LF** （`\n`）が標準の改行コードです。
- Windowsでは **CR+LF**（`\r\n`）が使われるため、シェルスクリプトをWindows形式で保存すると、Linux環境でエラーが発生することがあります。
- プログラミング言語（Pythonなど）では、`\n`を使うことで改行がほぼすべての環境で正しく動作します。

## **VSCodeでの文字コードの設定方法**

1. VSCodeでシェルスクリプトを開く。
2. 右下にある**改行コード**（ `LF` , `CRLF`になっている）をクリック。
3. 改行コードを選択すると改行コードを設定できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3964643/106c0d7f-8893-93fe-de0a-343c6bd4fbc7.png)

# **実際の操作手順まとめ**

1. WSLからVSCodeを開く:
WSLのターミナルで次のコマンドを実行してVSCodeを起動します。
    
    ```bash
    $ code shell_script.sh
    ```
    
    ※ 初回起動時には、下記の画像が表示されます。「**ホスト ‘wsl.localhost’ を永続的に許可する**」にチェックを入れて、「**許可**」をクリックしてください。
    
    ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3964643/ddc4061f-63dd-72a6-2a0e-bb9736ab51c7.png)
    
2. 新しいファイルを作成し、ファイル名を`shell_script.sh`などに変更（拡張子`.sh`をつけるのが基本）。
3. ファイルを保存する際、以下を確認：
    - **文字コード**: UTF-8
    （右下のステータスバーから変更可能）
    - **改行コード**: LF
    （右下のステータスバーから変更可能）
4. ファイルにプログラミングしていく。
5. 保存したら、WSLのターミナルに戻り、シェルスクリプトを実行する前に、権限を設定します。
    
    ```bash
    $ chmod +x shell_script.sh
    ```
    
6. 実行して動作確認を行います。
    
    ```bash
    $ ./shell_script.sh
    ```
    


# **VSCodeのデフォルトの設定**

VSCodeで文字コードや改行コードを毎回設定するのが面倒な場合は、以下の設定をすることによりデフォルト設定を変更することができます。

1. VSCodeで「**設定（Ctrl+,）**」を開く。
2. 「設定の検索」バーに`files.encoding`と入力し、デフォルトの文字コードを**UTF-8**に設定。
3. 「設定の検索」バーに`files.eol`と入力し、デフォルトの改行コードを**LF**に設定。



# **まとめ**

シェルスクリプトを作成する際は、

- **文字コード**は**UTF-8**
- **改行コード**は**LF**

を使う。

VSCodeの場合は右下で確認・変更ができます。プログラミングにおいては文字コードと改行コードは非常に重要です。プログラミングするときは意識しておいてくださいね。また、プログラムが動作しないときは文字コードや改行コードを確認してみてください。