VSCodeで文字コードを一括変換する方法

採用はこちら

VSCodeで文字コードを一括変換したい場合は、変換するファイル数や対象範囲によって方法を使い分ける必要があります。

VSCodeには、開いているファイルを別の文字コードで保存する標準機能があります。

ただし、フォルダ内にある複数の既存ファイルをまとめて別の文字コードへ変換する専用機能は、VSCode標準機能には用意されていません。

そのため、数ファイルだけであればVSCode標準機能を使い、大量のファイルを変換する場合は拡張機能やスクリプトを利用する方法が適しています。

特に、古いWebサイトや業務システムで使用されているShift_JIS系のファイルをUTF-8へ統一する場合は、文字化けや改行コードの変更などにも注意が必要です。

目次

VSCodeで文字コードを確認する方法

ステータスバーで現在の文字コードを確認する

VSCodeでファイルを開くと、画面下部のステータスバーに現在の文字コードが表示されます。

たとえば、UTF-8で開かれているファイルでは、次のように表示されます。

UTF-8

この表示をクリックすると、文字コードに関する操作を選択できます。

VSCodeでは、主に次の2つの操作を使用します。

  • エンコード付きで再度開く
  • エンコード付きで保存する

この2つは役割が異なるため、使い分けることが重要です。

1ファイルだけ文字コードを変換する方法

正しい文字コードでファイルを開き直す

ファイルが文字化けしている場合は、まず元の文字コードで正しく開き直します。

画面下部に表示されている文字コードをクリックし、「エンコード付きで再度開く」に相当する項目を選択します。

その後、元ファイルの文字コードを指定します。

たとえば、古いWindows環境で作成された日本語ファイルでは、Shift_JIS系の文字コードが使われている場合があります。

正しい文字コードを選択すると、文字化けしていた日本語が正常に表示されます。

UTF-8として保存する

正常に表示されたことを確認したら、再びステータスバーの文字コード表示をクリックします。

今度は「エンコード付きで保存」に相当する項目を選択し、保存先の文字コードとしてUTF-8を指定します。

これにより、元の文字コードで正しく読み込んだ内容をUTF-8として保存できます。

重要なのは、

「UTF-8として開き直す」

のではなく、

「元の文字コードで正しく開き直してからUTF-8で保存する」

という順序です。

文字化けした状態のままUTF-8として保存すると、文字化けした内容そのものが保存される可能性があります。

「再度開く」と「保存する」の違い

エンコード付きで再度開く

「エンコード付きで再度開く」は、ファイルそのものを書き換える操作ではありません。

VSCodeに対して、

「このファイルをどの文字コードとして解釈するか」

を指定する操作です。

たとえば、本来Shift_JIS系のファイルをUTF-8として誤認識している場合に、正しい文字コードを指定して開き直します。

エンコード付きで保存する

「エンコード付きで保存する」は、指定した文字コードで実際にファイルを書き直す操作です。

そのため、

Shift_JIS系のファイルをUTF-8へ変換する

といった目的では、最終的に「エンコード付きで保存する」を使用します。

files.encodingで一括変換はできない

files.encodingは保存や読み込み時の既定設定

VSCodeには、次のような設定があります。

{
    "files.encoding": "utf8"
}

この設定を指定すると、VSCodeでファイルを扱う際の既定の文字コードをUTF-8にできます。

しかし、この設定を追加しただけで、プロジェクト内に存在するShift_JISやCP932の既存ファイルが自動的にUTF-8へ書き換えられるわけではありません。

つまり、files.encodingは既存ファイルを一括変換する機能ではありません。

プロジェクト単位でも設定できる

文字コード設定は、VSCode全体に適用するユーザー設定だけでなく、ワークスペース設定としてプロジェクト単位で指定することもできます。

たとえば、特定のプロジェクトだけUTF-8を既定にしたい場合は、ワークスペースのsettings.jsonに次のように設定できます。

{
    "files.encoding": "utf8"
}

今後そのプロジェクトでファイルを作成・保存するときの文字コードを統一したい場合に有効です。

文字コードを自動判定する方法

files.autoGuessEncodingを有効にする

VSCodeには、ファイル内容から文字コードを推測する機能があります。

次のように設定します。

{
    "files.autoGuessEncoding": true
}

これを有効にすると、VSCodeがファイルの文字コードを推測して開こうとします。

Shift_JIS系やUTF-8など、複数の文字コードが混在している環境では便利な場合があります。

自動判定は完全ではない

文字コードの自動判定は、必ず正しく判定できるわけではありません。

内容によっては、

  • 別の文字コードとして誤認識する
  • 判定できない
  • 日本語が文字化けする

といったことがあります。

そのため、重要なファイルでは、自動判定だけを信用せず、実際の表示内容を確認することが重要です。

files.candidateGuessEncodingsも利用できる

現在のVSCodeでは、文字コード自動判定時の候補を指定するfiles.candidateGuessEncodingsという設定も利用できます。

日本語のファイルを多く扱う場合は、候補となる文字コードを絞ることで、判定精度を改善できる場合があります。

ただし、これも文字コードを一括変換する設定ではなく、あくまで文字コード判定を補助するための設定です。

複数ファイルを一括変換する方法

VSCode標準機能には一括変換機能がない

VSCode標準機能では、現在開いているファイルを別の文字コードで保存することはできます。

一方で、

「このフォルダ内にあるすべてのファイルをUTF-8へ変換する」

といった専用の一括変換機能はありません。

そのため、大量のファイルを変換する場合は、次の方法を利用します。

  • 文字コード変換用の拡張機能を使う
  • Pythonなどのスクリプトを使う
  • PowerShellなどのシェルを使う

参考サイト

Shift_JISファイルを文字化けなしでUTF-8に変換する小技 – KENTEM TechBlog

拡張機能を使って一括変換する方法

BatchEncodingなどの拡張機能を利用する

VSCode Marketplaceでは、文字コードをまとめて変換できるサードパーティー製拡張機能が公開されています。

たとえば、BatchEncodingのような拡張機能では、フォルダやワークスペース内のファイルをスキャンし、文字コードを確認しながら変換できます。

GUIで操作できるため、コマンドやプログラムに慣れていない場合でも比較的使いやすい方法です。

拡張機能は公式機能ではない

文字コード変換用の拡張機能は、基本的にMicrosoftが提供するVSCode標準機能ではありません。

そのため、導入前には次の項目を確認した方が安全です。

  • 発行元
  • 更新状況
  • Marketplace上の説明
  • 対応している文字コード
  • 除外対象となるファイル
  • ソースコードの公開状況

業務で使用している重要なプロジェクトでは、実行前にGitなどで復元できる状態にしておくことをおすすめします。

Pythonを使って一括変換する方法

CP932からUTF-8へ変換する例

変換元の文字コードが明確であれば、VSCodeの統合ターミナルからPythonスクリプトを実行する方法があります。

たとえば、すべてのHTMLファイルがCP932で保存されていることが確認できている場合は、次のようなコードを使用できます。

from pathlib import Path

root = Path(".")

for path in root.rglob("*.html"):
    try:
        text = path.read_text(encoding="cp932")
        path.write_text(text, encoding="utf-8")
        print(f"converted: {path}")
    except UnicodeDecodeError:
        print(f"skipped: {path}")

このコードでは、

path.read_text(encoding="cp932")

でCP932として読み込み、

path.write_text(text, encoding="utf-8")

でUTF-8として保存しています。

対象拡張子を複数指定する

HTML、CSS、JavaScript、PHPなどをまとめて変換したい場合は、対象拡張子を指定できます。

from pathlib import Path

root = Path(".")
extensions = {".html", ".htm", ".css", ".js", ".php"}

for path in root.rglob("*"):
    if path.is_file() and path.suffix.lower() in extensions:
        try:
            text = path.read_text(encoding="cp932")
            path.write_text(text, encoding="utf-8")
            print(f"converted: {path}")
        except UnicodeDecodeError:
            print(f"skipped: {path}")

これにより、指定した拡張子のファイルだけを対象にできます。

Shift_JISとCP932の違いに注意する

Shift_JISとCP932は完全に同じではない

日本語の文字コードを扱う場合は、Shift_JISとCP932を同一のものとして扱わないよう注意が必要です。

Windowsの日本語環境で作成された「Shift_JIS系」のファイルでは、実際にはCP932やWindows-31Jと呼ばれる文字コードが使われている場合があります。

そのため、Pythonでは状況に応じて、

encoding="shift_jis"

または、

encoding="cp932"

を使い分ける必要があります。

元の文字コードを確認してから変換する

すべてのShift_JIS系ファイルがCP932であるとは限りません。

そのため、

「Windowsで作成されたから必ずCP932」

と決めつけるのは避けた方が安全です。

元ファイルの文字コードが分かっている場合は、その文字コードに合わせて指定してください。

UTF-8とCP932が混在している場合は注意する

すべてをCP932として読み込むのは危険

Pythonの一括変換スクリプトでは、すべての対象ファイルを同じ文字コードとして読み込むことになります。

たとえば、

encoding="cp932"

としている場合、対象ファイルがすべてCP932であることが前提です。

UTF-8ファイルとCP932ファイルが混在している状態で実行すると、誤変換が発生する可能性があります。

エラーが出ないから正しいとは限らない

文字コードを誤って指定した場合でも、必ずUnicodeDecodeErrorが発生するとは限りません。

間違った文字として正常にデコードされてしまう場合があります。

そのため、

「エラーが出なかったから正しく変換できた」

とは判断できません。

変換後は、日本語や特殊文字が正しく表示されているか確認することが重要です。

UTF-8 BOMありとBOMなしの違い

UTF-8にはBOM付きもある

UTF-8には、主に次の2種類があります。

  • UTF-8 BOMなし
  • UTF-8 BOMあり

VSCodeは両方に対応しています。

BOM付きUTF-8を既定にしたい場合は、次のような設定も利用できます。

{
    "files.encoding": "utf8bom"
}

Web制作ではBOMなしが使われることが多い

Web制作では、特別な理由がなければUTF-8 BOMなしを採用するケースが多くあります。

特にPHPでは、BOMがファイル先頭の出力として扱われ、ヘッダー送信などに影響するケースがあります。

そのため、PHPを含むWebサイトでは、BOMの有無も確認しておくと安心です。

改行コードにも注意する

CRLFとLFは文字コードとは別の設定

文字コードを変換するときは、改行コードにも注意が必要です。

主な改行コードには、次の2種類があります。

  • CRLF
  • LF

Windows環境ではCRLF、LinuxやmacOSではLFが使われることが多い傾向があります。

ただし、文字コードと改行コードは別のものです。

たとえば、

CP932 + CRLF

から、

UTF-8 + LF

へ変更した場合は、文字コードだけでなく改行コードも変更したことになります。

Gitでは全行変更に見えることがある

改行コードまで変更すると、Git上ではほぼすべての行が変更されたように表示される場合があります。

文字コードだけを変更したい場合は、意図せず改行コードまで変化していないか確認してください。

VSCodeのステータスバーでは、現在の改行コードも確認できます。

HTMLのcharsetも変更する

ファイルだけUTF-8にしても不十分な場合がある

HTMLファイルをShift_JIS系からUTF-8へ変換した場合は、HTML内の文字コード指定も確認してください。

古いHTMLでは、次のような記述が使われている場合があります。

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

UTF-8へ変換した場合は、たとえば次のように変更します。

<meta charset="UTF-8">

ファイルそのものの文字コードとHTML内の指定が一致していないと、ブラウザで文字化けする可能性があります。

HTTPヘッダーも確認する

Webページの文字コードは、HTMLのmeta要素だけで決まるわけではありません。

Webサーバーから送信されるHTTPレスポンスヘッダーに文字コードが指定されている場合もあります。

たとえば、

Content-Type: text/html; charset=UTF-8

のような指定です。

Webサイト全体をUTF-8へ移行する場合は、サーバー側の設定も確認すると安全です。

PHPやデータベースを使用している場合の注意点

PHPファイル以外も確認する

PHPを使用しているWebサイトでは、PHPソースファイルだけをUTF-8へ変換すれば完了するとは限りません。

次のような項目も確認する必要があります。

  • HTMLのcharset
  • HTTPヘッダー
  • データベースの文字セット
  • データベース接続時の文字コード
  • CSVファイル
  • メール送信処理
  • 外部API
  • テンプレートファイル

特に古いシステムでは、複数の文字コードが混在している場合があります。

一括変換を行う前に、システム全体でどの文字コードが使われているか確認することが重要です。

node_modulesやvendorは変換しない

外部ライブラリは基本的に対象外にする

一括変換では、プロジェクト内のすべてのファイルを対象にしない方が安全です。

たとえば、次のようなディレクトリは通常除外します。

.git
node_modules
vendor

node_modulesやvendorには、npmやComposerなどで取得した外部ライブラリが保存されています。

これらを直接書き換えると、パッケージの再インストールで変更が消えたり、不具合が発生したりする可能性があります。

distやbuildはプロジェクトによって判断する

distやbuildは、自動生成される成果物として使用されることが多いディレクトリです。

自動生成物である場合は、直接文字コードを変換するのではなく、元となるソースファイルを変換してから再ビルドする方が適切です。

ただし、すべてのプロジェクトでdistやbuildが自動生成物とは限らないため、プロジェクト構成を確認して判断してください。

一括変換前にGitでバックアップする

まずgit statusを確認する

文字コードの一括変換では、多数のファイルが一度に書き換えられます。

実行前には、Gitなどを使って元の状態へ戻せるようにしておくことをおすすめします。

まず、次のコマンドで現在の状態を確認します。

git status

未コミットの変更がある場合は、その内容を確認してください。

問題がなければコミットする

変換前の状態を保存する場合は、必要なファイルをコミットします。

git add .
git commit -m "Backup before encoding conversion"

ただし、git add .は現在の変更をまとめてステージングするため、不要な変更まで含まれていないか事前に確認してください。

変換後はgit diffで確認する

意図しない変更がないか確認する

一括変換が終わったら、次のコマンドで変更内容を確認します。

git diff

確認するポイントは次のとおりです。

  • 文字化けしていないか
  • 不要なファイルまで変更されていないか
  • 改行コードが変化していないか
  • HTMLのcharsetが正しいか
  • BOMが意図せず追加されていないか

一括変換では、小さな設定ミスが大量のファイルに影響するため、変換後の確認が非常に重要です。

VSCodeで文字コードを一括変換するときのおすすめ手順

安全に変換する流れ

実際に文字コードを一括変換する場合は、次の流れで進めると安全です。

  1. git statusで現在の変更を確認する
  2. Gitやバックアップで元の状態を保存する
  3. 元ファイルの文字コードを確認する
  4. UTF-8とShift_JIS系が混在していないか確認する
  5. node_modulesやvendorなどを除外する
  6. 数ファイルだけ試験的に変換する
  7. 日本語や記号が正常に表示されるか確認する
  8. 問題がなければ一括変換する
  9. git diffで変更内容を確認する
  10. HTMLやHTTPヘッダーのcharsetを確認する
  11. Webサイトやアプリケーションを実際に動作確認する

最初からすべてのファイルを変換するのではなく、少数のファイルでテストしてから対象範囲を広げる方法が安全です。

まとめ

VSCodeには、開いているファイルを別の文字コードで開き直したり、別の文字コードで保存したりする標準機能があります。

ただし、フォルダ内の既存ファイルをまとめて別の文字コードへ変換する専用の標準機能はありません。

files.encodingをUTF-8に設定しても、既存ファイルが自動的にUTF-8へ一括変換されるわけではないため注意が必要です。

大量のファイルを変換する場合は、文字コード変換用の拡張機能やPythonなどのスクリプトを利用する方法が適しています。

また、Shift_JISとCP932は完全に同じものではないため、元ファイルの文字コードを確認したうえで変換することが重要です。

文字コード変換では、文字化けだけでなく、BOM、改行コード、HTMLのcharset、HTTPヘッダー、データベースなどにも影響する場合があります。

そのため、実際の作業では、

バックアップ → 少数ファイルでテスト → 一括変換 → Gitで差分確認 → 動作確認

という順序で進めると、安全に文字コードを統一しやすくなります。

以上、VSCodeで文字コードを一括変換する方法についてでした。

最後までお読みいただき、ありがとうございました。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次