VSCode文字コード設定完全ガイド!UTF-8・Shift_JIS・EUC-JPの変更方法

その他
スポンサーリンク
  1. 文字コードとは
  2. VSCodeのデフォルト文字コード
  3. 文字コードの確認方法
    1. 確認手順
  4. 個別ファイルの文字コード変更方法
    1. 方法1:ステータスバーから変更
    2. 方法2:コマンドパレットから変更
  5. デフォルト文字コードの変更方法
    1. 設定画面から変更
    2. settings.jsonで直接編集
  6. 文字コードの自動判別機能
    1. 自動判別の有効化
    2. 自動判別のメリットとデメリット
    3. 文字コード判別の優先順位設定
  7. ワークスペース別の文字コード設定
    1. ワークスペース設定とは
    2. ワークスペース設定の方法
  8. 言語別の文字コード設定
    1. settings.jsonでの設定方法
    2. 言語識別子の確認方法
  9. 改行コードの設定
    1. 改行コードの種類
    2. 改行コードの変更方法
  10. BOM(Byte Order Mark)について
    1. BOMとは
    2. UTF-8 with BOMとUTF-8の違い
    3. VSCodeでのBOM設定
  11. よく使われる文字コード一覧
    1. 日本語関連
    2. その他の文字コード
  12. HTMLファイルの文字コード変更時の注意点
    1. metaタグの修正
    2. Shift_JISからUTF-8への変換手順
  13. ターミナルの文字コード設定(Windows)
    1. Windowsでの問題
    2. 一時的な解決方法
    3. 恒久的な解決方法
  14. トラブルシューティング
    1. 問題1:ファイルを開くと文字化けする
    2. 問題2:保存すると文字化けする
    3. 問題3:一部の文字だけ文字化けする
    4. 問題4:Shift_JISファイルを開く度に文字化けする
    5. 問題5:GitでShift_JISファイルがうまく扱えない
    6. 問題6:複数人で開発していて文字コードが統一できない
  15. .editorconfigファイルでの文字コード設定
    1. .editorconfigとは
    2. 基本的な設定例
    3. VSCodeでの.editorconfigサポート
  16. おすすめの文字コード設定
    1. 新規プロジェクト(Web開発)
    2. レガシーWindowsプロジェクト
    3. 混在プロジェクト
  17. まとめ

文字コードとは

文字コード(エンコーディング)とは、コンピュータ上で文字を扱うための仕組みです。

同じ文字でも、文字コードが異なると正しく表示されず、文字化けが発生します。

主な文字コード

  • UTF-8:現在の標準、世界中の文字に対応
  • Shift_JIS:日本語Windows環境で使われてきた
  • EUC-JP:Unix/Linux環境で使われてきた
  • ISO-2022-JP:電子メールで使われてきた
  • UTF-16:Windowsの内部処理で使用

現在は、ほとんどの環境でUTF-8が推奨されています。

VSCodeのデフォルト文字コード

Visual Studio Code(VSCode)は、デフォルトでUTF-8を使用します。

デフォルト設定

  • 新規ファイル作成時:UTF-8
  • ファイルを開くとき:UTF-8として解釈
  • 保存時:UTF-8で保存

古いプロジェクトや日本語WindowsのファイルはShift_JISで保存されていることが多く、UTF-8として開くと文字化けします。

文字コードの確認方法

VSCodeでは、現在開いているファイルの文字コードを簡単に確認できます。

確認手順

画面右下のステータスバーを見てください。

「UTF-8」「Shift JIS」などと表示されている部分が、現在のファイルの文字コードです。

表示される情報

  • ファイルの文字コード
  • 改行コード(LF/CRLF)
  • 言語モード

この部分をクリックすると、文字コードを変更できるメニューが表示されます。

個別ファイルの文字コード変更方法

特定のファイルだけ文字コードを変更したい場合の方法です。

方法1:ステータスバーから変更

最も簡単で直感的な方法です。

文字化けしたファイルを正しく開き直す

  1. ファイルを開く(文字化けしていても構わない)
  2. 画面右下の文字コード表示(例:「UTF-8」)をクリック
  3. 「エンコード付きで再度開く」を選択
  4. 正しい文字コード(例:「Japanese (Shift JIS)」)を選択
  5. ファイルが正しい文字コードで開き直される

これで文字化けが解消され、正しく表示されます。

文字コードを変換して保存する

  1. ファイルを正しい文字コードで開く
  2. 画面右下の文字コード表示をクリック
  3. 「エンコード付きで保存」を選択
  4. 変換したい文字コード(例:「UTF-8」)を選択
  5. ファイルが新しい文字コードで保存される

重要な注意点

「エンコード付きで保存」を選択した時点で、ファイルの文字コードが変更されます。

元のファイルを残しておきたい場合は、先に別名保存またはバックアップを取ってください。

方法2:コマンドパレットから変更

キーボード操作で素早く変更できます。

手順

  1. Ctrl + Shift + P(Mac:Cmd + Shift + P)でコマンドパレットを開く
  2. 「エンコード」または「encoding」と入力
  3. 「エンコード付きで再度開く」または「エンコード付きで保存」を選択
  4. 文字コードを選択

コマンドパレットからも、ステータスバーと同じ操作ができます。

デフォルト文字コードの変更方法

新規ファイルやファイルを開くときのデフォルト文字コードを変更できます。

設定画面から変更

GUI(グラフィカルユーザーインターフェース)で簡単に設定できます。

手順

  1. Ctrl + ,(Mac:Cmd + ,)で設定を開く
  2. または「ファイル」→「ユーザー設定」→「設定」
  3. 検索ボックスに「encoding」と入力
  4. 「Files: Encoding」を見つける
  5. ドロップダウンメニューから文字コードを選択

選択できる主な文字コード

  • utf8(デフォルト)
  • utf8bom(UTF-8 with BOM)
  • utf16le(UTF-16 LE)
  • utf16be(UTF-16 BE)
  • shiftjis(Shift_JIS)
  • eucjp(EUC-JP)
  • iso88591(Latin1)
  • windows1252
  • その他多数

この設定を変更すると、以降に作成する新規ファイルやデフォルトで開くファイルの文字コードが変更されます。

settings.jsonで直接編集

より詳細な設定が可能です。

settings.jsonを開く方法

  1. Ctrl + Shift + P(Mac:Cmd + Shift + P)でコマンドパレットを開く
  2. 「settings json」と入力
  3. 「基本設定:設定(JSON)を開く」を選択

または

  1. 設定画面を開く
  2. 右上の「設定(JSON)を開く」アイコンをクリック

基本的な設定例

{
  "files.encoding": "utf8"
}

Shift_JISをデフォルトにする例

{
  "files.encoding": "shiftjis"
}

注意点

設定値は小文字で記述し、ハイフンなしで書きます。

  • 正しい:"shiftjis"
  • 誤り:"Shift_JIS", "shift-jis"

文字コードの自動判別機能

VSCodeには、ファイルを開くときに文字コードを自動的に判別する機能があります。

自動判別の有効化

設定方法

  1. 設定画面を開く(Ctrl + ,)
  2. 「Files: Auto Guess Encoding」を検索
  3. チェックボックスにチェックを入れる

settings.jsonでの設定

{
  "files.autoGuessEncoding": true
}

自動判別のメリットとデメリット

メリット

  • 異なる文字コードのファイルを自動的に正しく開ける
  • 手動で文字コードを選択する手間が省ける
  • 混在プロジェクトで便利

デメリット

  • 判別が間違うことがある
  • ファイルを開く速度が若干遅くなる
  • 予期しない文字コードで開かれる可能性

推奨設定

基本的にはオフ(デフォルト)のままが推奨されます。

必要に応じて手動で文字コードを変更する方が確実です。

ただし、複数の文字コードが混在するプロジェクトでは、有効にすると便利な場合があります。

文字コード判別の優先順位設定

自動判別を有効にした場合、判別の優先順位を設定できます。

settings.jsonでの設定例

{
  "files.autoGuessEncoding": true,
  "files.encodingOrder": ["shiftjis", "eucjp", "utf8"]
}

この例では、Shift_JIS → EUC-JP → UTF-8の順で判別を試みます。

ワークスペース別の文字コード設定

特定のプロジェクトやフォルダだけ、異なる文字コードを使いたい場合があります。

ワークスペース設定とは

ワークスペース設定は、特定のフォルダにのみ適用される設定です。

ユーザー設定とワークスペース設定の違い

  • ユーザー設定:VSCode全体に適用される
  • ワークスペース設定:開いているフォルダにのみ適用される

ワークスペース設定は、ユーザー設定より優先されます。

ワークスペース設定の方法

方法1:設定画面から

  1. 設定を開く(Ctrl + ,)
  2. 上部のタブで「ワークスペース」を選択
  3. 「Files: Encoding」で文字コードを設定

これで、現在開いているフォルダにのみ設定が適用されます。

方法2:.vscodeフォルダを使う

プロジェクトのルートフォルダに.vscodeフォルダとsettings.jsonを作成します。

手順

  1. プロジェクトのルートフォルダに.vscodeフォルダを作成
  2. .vscodeフォルダ内にsettings.jsonを作成
  3. 以下のように記述
{
  "files.encoding": "shiftjis"
}

Shift_JISプロジェクトの完全な設定例

{
  "files.encoding": "shiftjis",
  "files.autoGuessEncoding": true,
  "files.encodingOrder": ["shiftjis", "eucjp", "utf8"],
  "files.eol": "\r\n"
}

この設定で:

  • デフォルト文字コード:Shift_JIS
  • 自動判別:有効
  • 判別優先順位:Shift_JIS → EUC-JP → UTF-8
  • 改行コード:CRLF(Windows形式)

方法3:ワークスペースファイルを使う

より高度な設定が可能です。

プロジェクトのルートフォルダにproject.code-workspaceファイルを作成します。

{
  "folders": [
    {
      "path": "."
    }
  ],
  "settings": {
    "files.encoding": "shiftjis",
    "files.autoGuessEncoding": true
  }
}

このファイルをVSCodeで開くと、ワークスペースとして認識されます。

言語別の文字コード設定

特定の言語のファイルだけ、文字コードを変更することもできます。

settings.jsonでの設定方法

{
  "[html]": {
    "files.encoding": "utf8"
  },
  "[powershell]": {
    "files.encoding": "utf8bom"
  },
  "[python]": {
    "files.encoding": "utf8"
  }
}

この例では:

  • HTMLファイル:UTF-8
  • PowerShellスクリプト:UTF-8 with BOM
  • Pythonファイル:UTF-8

言語識別子の確認方法

言語識別子は、ステータスバーの右下に表示されています。

主な言語識別子

  • html
  • css
  • javascript
  • typescript
  • python
  • java
  • php
  • ruby
  • go
  • c
  • cpp
  • csharp
  • powershell

完全なリストは、VS Code公式ドキュメントで確認できます。

改行コードの設定

文字コードと合わせて、改行コードも重要な設定です。

改行コードの種類

主な改行コード

  • LF(Line Feed):Unix/Linux/Mac
  • CRLF(Carriage Return + Line Feed):Windows

現在の改行コードは、ステータスバーの右下に表示されます。

改行コードの変更方法

個別ファイル

  1. ステータスバーの「LF」または「CRLF」をクリック
  2. 変更したい改行コードを選択

デフォルト設定

{
  "files.eol": "\n"
}
  • "\n":LF
  • "\r\n":CRLF

自動検出

{
  "files.eol": "auto"
}

ファイルごとに既存の改行コードを維持します。

BOM(Byte Order Mark)について

BOMは、ファイルの先頭に付加される特殊なマーカーです。

BOMとは

UTF-8やUTF-16などのUnicode文字コードで使用されます。

BOMの役割

  • 文字コードを明示的に示す
  • バイトオーダー(エンディアン)を示す

UTF-8 with BOMとUTF-8の違い

UTF-8

  • BOMなし
  • Linux/Macで一般的
  • Webページで推奨

UTF-8 with BOM

  • BOMあり
  • Windowsの一部アプリで必要
  • PHPなどで問題を起こす場合がある

VSCodeでのBOM設定

UTF-8 with BOMで保存

  1. ステータスバーの文字コードをクリック
  2. 「エンコード付きで保存」
  3. 「UTF-8 with BOM」を選択

settings.jsonでデフォルト設定

{
  "files.encoding": "utf8bom"
}

BOMの削除

UTF-8 with BOMのファイルをUTF-8に変換:

  1. ステータスバーの「UTF-8 with BOM」をクリック
  2. 「エンコード付きで保存」
  3. 「UTF-8」を選択

よく使われる文字コード一覧

VSCodeで選択できる主な文字コードと用途です。

日本語関連

UTF-8

  • 用途:現代の標準、Webページ、プログラミング全般
  • 推奨度:★★★★★
  • 特徴:全世界の文字に対応、ファイルサイズが小さい

UTF-8 with BOM

  • 用途:Windows環境、PowerShell
  • 推奨度:★★★☆☆
  • 特徴:Windowsアプリとの互換性が高い

Shift_JIS (Japanese (Shift JIS))

  • 用途:古いWindowsプロジェクト、レガシーシステム
  • 推奨度:★★☆☆☆
  • 特徴:日本語Windows環境で広く使われてきた

EUC-JP (Japanese (EUC-JP))

  • 用途:古いUnix/Linuxシステム
  • 推奨度:★☆☆☆☆
  • 特徴:Unix環境で使われてきた

ISO-2022-JP (Japanese (ISO 2022-JP))

  • 用途:電子メール
  • 推奨度:★☆☆☆☆
  • 特徴:メールで使われてきたが、現在はUTF-8が主流

その他の文字コード

UTF-16 LE / UTF-16 BE

  • 用途:Windowsの内部処理、一部のデータベース
  • 特徴:2バイト単位、BOMでバイトオーダーを判別

Windows-1252 (Western European)

  • 用途:古いWindows環境の西欧言語
  • 特徴:Latin1の拡張版

ISO-8859-1 (Latin1)

  • 用途:西欧言語
  • 特徴:ASCII互換

HTMLファイルの文字コード変更時の注意点

HTMLファイルの文字コードを変更する場合、特別な注意が必要です。

metaタグの修正

HTMLファイルには、文字コードを宣言するmetaタグがあります。

UTF-8の場合

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>ページタイトル</title>
</head>
<body>
  <!-- コンテンツ -->
</body>
</html>

Shift_JISの場合

<!DOCTYPE html>
<html>
<head>
  <meta charset="Shift_JIS">
  <title>ページタイトル</title>
</head>
<body>
  <!-- コンテンツ -->
</body>
</html>

重要な注意点

VSCodeで文字コードを変更しただけでは、metaタグは自動的に変更されません。

必ず手動でmetaタグも修正してください。

metaタグとファイルの実際の文字コードが一致しないと、ブラウザで文字化けします。

Shift_JISからUTF-8への変換手順

  1. Shift_JISのHTMLファイルをVSCodeで開く
  2. ステータスバーの「UTF-8」をクリック
  3. 「エンコード付きで再度開く」→「Japanese (Shift JIS)」
  4. 正しく表示されることを確認
  5. ステータスバーの「Shift JIS」をクリック
  6. 「エンコード付きで保存」→「UTF-8」
  7. metaタグを<meta charset="UTF-8">に修正
  8. 保存

ターミナルの文字コード設定(Windows)

VSCodeの統合ターミナルも、文字コード設定が必要な場合があります。

Windowsでの問題

Windows環境では、ターミナルのデフォルト文字コードがCP932(Shift_JIS)です。

プログラムの出力がUTF-8の場合、文字化けします。

一時的な解決方法

ターミナルで以下のコマンドを実行します。

chcp 65001

65001はUTF-8のコードページ番号です。

これでターミナルの文字コードがUTF-8に変更されます。

ただし、VSCodeを閉じるとリセットされます。

恒久的な解決方法

方法1:settings.jsonで自動実行

{
  "terminal.integrated.profiles.windows": {
    "PowerShell": {
      "source": "PowerShell",
      "args": ["-NoExit", "-Command", "chcp 65001"]
    }
  }
}

ターミナル起動時に自動的にchcp 65001が実行されます。

方法2:Windowsのシステム設定を変更

  1. Windowsの検索で「intl.cpl」と入力
  2. 「地域」設定画面を開く
  3. 「管理」タブ→「システムロケールの変更」
  4. 「ベータ:ワールドワイド言語サポートでUnicode UTF-8を使用」にチェック
  5. 再起動

この設定により、Windows全体のデフォルト文字コードがUTF-8になります。

トラブルシューティング

文字コード関連でよくある問題と解決方法です。

問題1:ファイルを開くと文字化けする

原因

ファイルの文字コードとVSCodeが認識している文字コードが異なります。

解決方法

  1. ステータスバーの文字コード表示をクリック
  2. 「エンコード付きで再度開く」
  3. 正しい文字コードを選択

よくあるパターン:

  • 古いWindowsファイル→Shift_JIS
  • 古いUnixファイル→EUC-JP
  • メールの添付ファイル→ISO-2022-JP

問題2:保存すると文字化けする

原因

間違った文字コードで「エンコード付きで保存」を実行した可能性があります。

解決方法

  1. Ctrl + Zで元に戻す(保存直後の場合)
  2. またはファイルを閉じずに、正しい文字コードで再度保存
  3. バックアップがあれば復元

予防策

「エンコード付きで保存」を実行する前に:

  • 元のファイルをバックアップ
  • またはGitなどのバージョン管理を使用

問題3:一部の文字だけ文字化けする

原因

選択した文字コードでは表現できない文字が含まれています。

例:UTF-8ファイルに絵文字があり、Shift_JISで保存しようとした場合

解決方法

  1. UTF-8など、より広範囲の文字をサポートする文字コードを使用
  2. または、問題の文字を削除・置換

問題4:Shift_JISファイルを開く度に文字化けする

原因

VSCodeがデフォルトでUTF-8として開くため。

解決方法

以下のいずれかを実施:

方法1:自動判別を有効化

{
  "files.autoGuessEncoding": true
}

方法2:ワークスペース設定でShift_JISをデフォルトに

{
  "files.encoding": "shiftjis"
}

方法3:毎回手動で開き直す

(非推奨。手間がかかる)

問題5:GitでShift_JISファイルがうまく扱えない

原因

GitはUTF-8を前提としているため、Shift_JISファイルで問題が起きやすいです。

解決方法

可能であれば、ファイルをUTF-8に変換することを推奨します。

どうしてもShift_JISを維持する必要がある場合:

.gitattributesファイルで設定

*.txt text eol=crlf
*.csv text eol=crlf

ただし、これは改行コードの設定であり、文字コードそのものは解決しません。

問題6:複数人で開発していて文字コードが統一できない

原因

チームメンバーがそれぞれ異なる文字コード設定を使用している。

解決方法

プロジェクトに.vscode/settings.jsonを追加してバージョン管理します。

{
  "files.encoding": "utf8",
  "files.eol": "\n",
  "files.insertFinalNewline": true,
  "files.trimTrailingWhitespace": true
}

これをGitにコミットすることで、チーム全体で設定を共有できます。

さらに、.editorconfigファイルを使うと、VSCode以外のエディタでも設定を共有できます。

.editorconfigファイルでの文字コード設定

複数のエディタで統一した文字コード設定を使いたい場合に便利です。

.editorconfigとは

様々なエディタで共通の設定を定義できるファイルです。

VSCodeはデフォルトで.editorconfigに対応しています。

基本的な設定例

プロジェクトのルートに.editorconfigファイルを作成します。

root = true

[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true

[*.txt]
charset = shift_jis
end_of_line = crlf

[*.csv]
charset = shift_jis

[*.{js,ts,html,css}]
charset = utf-8

この設定で:

  • 全ファイル:UTF-8、LF、末尾に改行、行末空白削除
  • .txtファイル:Shift_JIS、CRLF
  • .csvファイル:Shift_JIS
  • JS/TS/HTML/CSSファイル:UTF-8

VSCodeでの.editorconfigサポート

VSCodeは.editorconfigをネイティブサポートしていますが、より高機能な拡張機能もあります。

推奨拡張機能

「EditorConfig for VS Code」

marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig

インストールすると、.editorconfigの設定がより確実に適用されます。

おすすめの文字コード設定

プロジェクトタイプ別の推奨設定です。

新規プロジェクト(Web開発)

{
  "files.encoding": "utf8",
  "files.eol": "\n",
  "files.insertFinalNewline": true,
  "files.trimTrailingWhitespace": true,
  "files.autoGuessEncoding": false
}

UTF-8、LF改行が現代の標準です。

レガシーWindowsプロジェクト

{
  "files.encoding": "shiftjis",
  "files.eol": "\r\n",
  "files.autoGuessEncoding": true,
  "files.encodingOrder": ["shiftjis", "eucjp", "utf8"]
}

Shift_JIS、CRLF改行を維持します。

混在プロジェクト

{
  "files.encoding": "utf8",
  "files.eol": "auto",
  "files.autoGuessEncoding": true,
  "files.encodingOrder": ["utf8", "shiftjis", "eucjp"]
}

自動判別を有効にし、既存ファイルの設定を維持します。

まとめ

VSCodeの文字コード設定について、重要なポイントをおさらいします。

基本操作

  • 確認:画面右下のステータスバー
  • 変更:ステータスバーをクリック→文字コード選択
  • 「再度開く」:ファイルを開き直す
  • 「保存」:文字コードを変換

デフォルト設定

  • 設定画面:Ctrl + ,→「encoding」で検索
  • 「Files: Encoding」で変更
  • settings.json:"files.encoding": "utf8"

自動判別

  • 「Files: Auto Guess Encoding」で有効化
  • settings.json:"files.autoGuessEncoding": true
  • デフォルトはオフ(手動設定が確実)

ワークスペース設定

  • .vscode/settings.jsonで特定フォルダの設定
  • プロジェクトごとに異なる文字コードを使える
  • チームで設定を共有可能

推奨文字コード

  • 新規プロジェクト:UTF-8
  • Webページ:UTF-8
  • レガシーシステム:既存の文字コードを維持
  • チーム開発:統一が重要

よく使う文字コード

  • UTF-8:現代の標準
  • UTF-8 with BOM:Windows環境
  • Shift_JIS:古いWindowsファイル
  • EUC-JP:古いUnixファイル

HTMLファイルの注意点

  • 文字コード変更時はmetaタグも修正必須
  • <meta charset="UTF-8">

ターミナル設定(Windows)

  • chcp 65001でUTF-8に変更
  • settings.jsonで自動実行可能
  • システム設定でUTF-8を標準化も可能

トラブル対策

  • 文字化け→正しい文字コードで再度開く
  • バックアップを取る習慣
  • Gitで設定を共有(.vscode/settings.json)
  • .editorconfigでエディタ間の統一

文字コードの設定は、プログラミングにおいて基本的ながら重要な要素です。

正しく設定することで、文字化けのトラブルを防ぎ、チーム開発もスムーズになります。

特に日本語を扱う場合は、UTF-8への統一を強く推奨します。

コメント

タイトルとURLをコピーしました