Visual Studio Codeでソースコードを該当文字コードに表示

# 概要
Visual Studio Codeで編集したソースコードを表示すると基本UTF-8で表示されるので、
S-jis,eucなどで作られたソースだと日本語が文字化けになるケースがありました。
この部分をソースを開いたときに自動でファイルの文字コードに合わせて編集できるようにする設定について説明したいと思います。

# Visual Studio Codeインストールについて
前の記事を参考してインストールをしてみてください。

https://qiita.com/neomi/items/55d0d31c54b47d376367

# 既存のソースを確認
以下の二つの文字コードのソースを用意します。
①eucjp
②S-jis
②UTF-8

Visual Studio Codeで「ファイル(F)>フォルダを開く...」選択または「CTRL+K,O」順番でキーをクリックします。

①以下の画面が表示されますが、ここで用意されたソースのフォルダを選択します。
※既に選択されている画面での表示です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/6b9acd7f-232b-1f10-b751-dd270fa8eee7.png)


②以下の画面のように表示されます。
※ファイルの選択だけで内容が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/8d39a291-2f9f-b14e-e83c-2d27bb29af0a.png)


# 設定前のソースコード表示を確認
用意したファイルをVisual Studio Codeで確認します。

①eucjpファイルのソースコードです。日本語のコメントが文字化けになっていることが分かります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/0868a49a-bf88-bfea-4df8-c146c515c11d.png)

②S-jisファイルのソースコードです。日本語のコメントが文字化けになっていることが分かります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/4d157317-9111-a3d0-c1a1-d3166d6839e6.png)

③UTF-8ファイルのソースコードです。日本語が正しく表示されていることが分かります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/1bb9efe5-faa9-abb7-59e7-a90487322430.png)

# 文字が文字化けにならないように設定する手順
①下記の「ファイル(F)>ユーザー設定>設定」選択または「Ctrl+,」キーをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/401e4c5a-97e0-1a38-2bba-6b4d2372678c.png)

②次の画面で入力欄に「files」を入力します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/29eb6492-a39e-eded-7ead-a07766bf4309.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/37ba6f72-0b53-8d27-a0f1-fb8720096b65.png)

③以下の項目にチェックを入れます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/dcd33f9e-34ec-d64f-2059-1ff08a31b798.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/f0a8515a-5ff1-3e6c-73e1-d1e4c64edbb4.png)

④「設定×」タブを閉じます。もし開いているファイルもある場合、すべて閉じます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/f1e6f34b-e332-a803-7b46-a46de9c29221.png)

⑤文字が文字化けになったファイルを選択します。
・EUCJPファイルです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/50273adf-54d7-23fb-f6e5-daeb0b9f927a.png)

・Sjisファイルです。まだ文字が文字化けになっています。ふむ。。。。
次の画面で右下にある文字コードをSJISに選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/ab44ec14-ad6d-606e-d786-9fcd3cd457f4.png)

文字コード選択前
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/8aa96390-5289-670a-b776-04c1d07e78d5.png)

文字コード選択後
次の画面で文字コードを選択すると以下の画面が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/8aa96390-5289-670a-b776-04c1d07e78d5.png)

以下の画面で「エンコード付きで再度開く」を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/e80125f3-abcf-35be-acae-088f42395723.png)

指定するSJIS文字コードを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/89f4be3d-4347-103f-1514-bae8d54393fc.png)

文字が正しく表示されています。これで解決です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162336/a847b51e-8212-d8c5-2f9e-f851358c5096.png)

# 参考サイト
https://www.javadrive.jp/vscode/file/index8.html

# 最後に
最近UTF8文字コードになっているのが多いと思いますが、昔作られたソースを見ると
EUCJP、SJIS（SHIFT-JIS）になっているのもありましたので、Visual Studio Codeで表示すると文字化けになったので、
インタネットで調べて設定方法を自分のQiitaにメモしました。
こうすることで検索より自分のQiitaから確認するのが早いかと考えてメモしました。
次はSSHでLinux（RaspberryPI)に接続してコードを編集する設定について説明したいと思います。