Sublime Textはどんな言語に対応している?|初心者向けに特徴と使い方を解説

プログラミング・IT

「Sublime Textってプログラミングに使うエディタって聞いたけど、いったいどんな言語に対応しているの?」
「HTMLやPythonくらいなら知ってるけど、他の言語も使えるのかな?」

こんな疑問を持っている方は多いのではないでしょうか。

この記事では、以下について詳しく解説します:

  • Sublime Textが標準で対応している言語の全貌
  • 言語別の便利な機能と使い分け方法
  • 手動での言語設定とその活用法
  • プラグインによる対応言語の拡張方法
  • 実際の開発での使い方とコツ
スポンサーリンク

Sublime Textの標準言語サポート

標準で対応している言語の全体像

Sublime Textは、80種類以上のプログラミング言語とマークアップ言語に標準対応しています。

Web開発言語

フロントエンド

  • HTML:Webページの構造を作る言語
  • CSS:スタイルシートで見た目を制御
  • JavaScript:ブラウザで動作するプログラミング言語
  • TypeScript:JavaScriptの型安全版(プラグイン推奨)

マークアップ・データ形式

  • XML:データ交換用の構造化言語
  • JSON:データ交換でよく使われる軽量フォーマット
  • YAML:設定ファイルでよく使われる人間に読みやすい形式
  • Markdown:文書作成用の軽量マークアップ言語

サーバーサイド・スクリプト言語

人気の高い言語

  • Python:AI・機械学習・Web開発で人気
  • PHP:Web開発で広く使われる
  • Ruby:Ruby on Railsで有名
  • Node.js:サーバーサイドJavaScript

シェルスクリプト

  • Bash:Linux/macOSの標準シェル
  • PowerShell:Windowsの高機能シェル
  • Batch:Windowsのバッチファイル

システム開発・コンパイル言語

C系言語

  • C:システムプログラミングの基础
  • C++:Cの拡張版、オブジェクト指向対応
  • C#:Microsoft.NET Framework用言語

エンタープライズ言語

  • Java:企業システムで広く使用
  • Scala:JVM上で動作する関数型言語
  • Kotlin:Androidアプリ開発で人気

モダン言語

  • Go:Googleが開発したシンプルで高速な言語
  • Rust:メモリ安全性を重視したシステム言語
  • Swift:Appleが開発したiOS/macOS用言語

データベース・設定言語

データベース

  • SQL:データベース操作の標準言語
  • SQLite:軽量データベース用SQL

設定・記述言語

  • INI:設定ファイルの定番形式
  • TOML:設定ファイル用の現代的な形式
  • Properties:Javaの設定ファイル形式

言語別の便利機能

シンタックスハイライト(構文強調)

各言語に応じて、コードが色分けされます:

Python の例

def hello_world():  # 関数定義:紫色
    message = "Hello, World!"  # 文字列:緑色
    print(message)  # 組み込み関数:青色
    return True  # キーワード:紫色

HTML の例

<!DOCTYPE html>  <!-- コメント:グレー -->
<html lang="ja">  <!-- タグ:青色、属性:赤色 -->
    <title>サンプル</title>  <!-- 文字列:緑色 -->
</html>

自動インデント

言語に応じて適切なインデントが自動で設定されます:

言語インデント理由
Pythonスペース4つPEP 8(Python公式スタイルガイド)準拠
JavaScriptスペース2つWeb開発の一般的な慣習
HTMLスペース2つネストが深くなりがちなため
C/C++タブまたはスペース4つプロジェクトにより異なる

括弧の対応表示

対応する括弧がハイライトされ、ネストの深い処理でも見失いません:

function complexFunction(data) {
    if (data.length > 0) {
        data.forEach(item => {
            if (item.active) {
                console.log(item.name);
            }
        });
    }
}  // ← この括弧がどこと対応するか一目で分かる

コード折りたたみ

長い関数やクラスを折りたたんで、コード全体の構造を把握しやすくできます:

class DataProcessor:  # ← ここをクリックすると
    def __init__(self):   # この部分が
        self.data = []    # 折りたたまれる
    
    def process(self):    # ← ここをクリックすると
        # 長い処理...      # この部分が
        pass              # 折りたたまれる

言語のハイライトを手動で切り替える方法

自動判定の仕組み

Sublime Textは、ファイルの拡張子を見て自動的に言語を判定します:

拡張子判定される言語用途
.htmlHTMLWebページ
.cssCSSスタイルシート
.jsJavaScriptブラウザスクリプト
.pyPythonPythonスクリプト
.phpPHPWebアプリケーション
.javaJavaJavaアプリケーション
.cppC++システムプログラム
.mdMarkdown文書作成

手動での言語切り替え

基本的な切り替え方法

  1. 画面右下の言語表示をクリック
    • 例:「Plain Text」「HTML」「Python」など
  2. 言語リストから選択
    • アルファベット順で表示される
    • よく使う言語は上部に表示される
  3. 即座に反映
    • 選択すると同時にハイライトが変更される

キーボードショートカットでの切り替え

Windows/Linux

  • Ctrl + Shift + P → 「Set Syntax」と入力 → 言語名を入力

Mac

  • Cmd + Shift + P → 「Set Syntax」と入力 → 言語名を入力

実用的な活用例

例1:拡張子なしのファイル

シェルスクリプトファイル(拡張子なし)の場合:

  1. ファイル内容:#!/bin/bash
  2. 右下をクリック → 「Shell Script (Bash)」を選択
  3. シェルスクリプトとして色分けされる

例2:設定ファイルの編集

.configファイルをJSONとして編集したい場合:

  1. 設定ファイルを開く
  2. 右下をクリック → 「JSON」を選択
  3. JSON形式でハイライトされ、構文エラーも分かる

例3:READMEファイルの記述

README.txtをMarkdownとして書きたい場合:

  1. ファイルを開く
  2. 右下をクリック → 「Markdown」を選択
  3. Markdown記法が色分けされ、見出しが分かりやすくなる

言語設定の保存

将来的な自動判定

一度手動で言語を設定すると、Sublime Textが学習して同じような内容のファイルを自動判定するようになります。

プロジェクト設定での固定

プロジェクト全体で特定のファイルタイプの言語を固定できます:

{
    "folders": [
        {
            "path": "."
        }
    ],
    "settings": {
        "syntax_associations": {
            "*.config": "Packages/JSON/JSON.sublime-syntax",
            "Dockerfile.*": "Packages/Dockerfile/Dockerfile.sublime-syntax"
        }
    }
}

プラグインによる言語サポートの拡張

Package Controlの基本

インストール方法

  1. コマンドパレットを開く
    • Ctrl + Shift + P(Windows/Linux)
    • Cmd + Shift + P(Mac)
  2. Package Controlをインストール
    • 「Install Package Control」と入力してEnter
  3. プラグインのインストール
    • Ctrl + Shift + P → 「Package Control: Install Package」

人気の言語サポートプラグイン

Web開発系

TypeScript

  • プラグイン名:「TypeScript」
  • 機能:シンタックスハイライト、エラー検出、自動補完
  • 使用場面:大規模なJavaScript開発、型安全性が必要なプロジェクト

SCSS/Sass

  • プラグイン名:「Sass」
  • 機能:SCSS/Sass記法のハイライト、入れ子構造の表示
  • 使用場面:効率的なCSS開発、変数やミックスインを活用

Vue.js

  • プラグイン名:「Vue Syntax Highlight」
  • 機能:Vue.jsの単一ファイルコンポーネント対応
  • 使用場面:Vue.jsを使ったSPA開発

モダン言語・フレームワーク

Docker

  • プラグイン名:「Dockerfile」
  • 機能:Dockerfileの構文ハイライト、コマンド補完
  • 使用場面:コンテナ化されたアプリケーション開発

LaTeX

  • プラグイン名:「LaTeXTools」
  • 機能:数式、参考文献、図表の補完機能
  • 使用場面:学術論文、技術文書の作成

R言語

  • プラグイン名:「R-Box」
  • 機能:統計解析コードのハイライト、REPLとの連携
  • 使用場面:データ分析、統計モデリング

設定・データ形式

GraphQL

  • プラグイン名:「GraphQL」
  • 機能:クエリの構文ハイライト、スキーマ補完
  • 使用場面:モダンAPI開発

Protocol Buffers

  • プラグイン名:「Protocol Buffer」
  • 機能:.protoファイルの構文サポート
  • 使用場面:gRPCを使ったマイクロサービス開発

プラグインのインストール手順

具体例:TypeScriptサポートの追加

  1. Package Controlを開く Ctrl + Shift + P → Package Control: Install Package
  2. TypeScriptを検索
    • 「TypeScript」と入力
    • 候補から「TypeScript」を選択
  3. インストール完了
    • 自動的にダウンロード・インストールされる
    • .tsファイルを開くと自動でTypeScriptとして認識
  4. 動作確認 interface User { name: string; age: number; } const user: User = { name: "田中", age: 30 };

高度なプラグイン活用

LSP(Language Server Protocol)

概要 Language Server Protocolを使うことで、IDE並みの高機能な言語サポートを実現できます。

主要なLSPプラグイン

  • LSP:基本的なLSPクライアント
  • LSP-typescript:TypeScript用
  • LSP-pyright:Python用
  • LSP-rust-analyzer:Rust用

提供される機能

  • リアルタイムエラー検出:タイプしながらエラーを表示
  • 高度な自動補完:関数の引数、クラスのメンバーを正確に補完
  • 定義へのジャンプ:関数や変数の定義元に瞬時に移動
  • リファクタリング:変数名の一括変更など

設定の最適化

言語別の個別設定

{
    "Python": {
        "tab_size": 4,
        "translate_tabs_to_spaces": true,
        "rulers": [79, 88]
    },
    "JavaScript": {
        "tab_size": 2,
        "translate_tabs_to_spaces": true
    },
    "Go": {
        "tab_size": 8,
        "translate_tabs_to_spaces": false
    }
}

実際の開発での言語切り替え活用法

マルチ言語プロジェクトでの活用

Web開発プロジェクトの例

ファイル構成

project/
├── index.html          # HTML
├── style.css           # CSS
├── script.js           # JavaScript
├── server.py           # Python(バックエンド)
├── config.json         # JSON(設定)
├── README.md           # Markdown(ドキュメント)
└── requirements.txt    # Plain Text(依存関係)

各ファイルでの自動認識

  • index.html:自動でHTML認識、タグ補完が有効
  • style.css:CSS認識、プロパティ補完が有効
  • script.js:JavaScript認識、関数補完が有効
  • server.py:Python認識、構文チェックが有効

設定ファイルの効率的な編集

Dockerfileの編集

  1. ファイル名:Dockerfile(拡張子なし)
  2. 自動認識:されない場合が多い
  3. 手動設定:右下から「Dockerfile」を選択
  4. 効果:コマンド補完、構文ハイライトが有効

設定ファイルをYAMLとして編集

  1. ファイル名:.gitlab-ci.ymldocker-compose.yml
  2. 自動認識:YAML形式として認識
  3. 効果:インデント補助、構文チェックが有効

学習・実験での活用

プログラミング学習での言語切り替え

同一ファイルで複数言語を試す場合

  1. 新規ファイル作成(test.txt)
  2. Python として試す
    • 右下から「Python」選択
    • Pythonコードを記述・実行
  3. JavaScript として試す
    • 内容をクリア
    • 右下から「JavaScript」選択
    • JavaScriptコードを記述・実行

アルゴリズム学習での活用

同じアルゴリズムを複数言語で実装

# Python版(test.py)
def bubble_sort(arr):
    n = len(arr)
    for i in range(n):
        for j in range(0, n-i-1):
            if arr[j] > arr[j+1]:
                arr[j], arr[j+1] = arr[j+1], arr[j]
    return arr
// JavaScript版(test.js)
function bubbleSort(arr) {
    const n = arr.length;
    for (let i = 0; i < n; i++) {
        for (let j = 0; j < n - i - 1; j++) {
            if (arr[j] > arr[j + 1]) {
                [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
            }
        }
    }
    return arr;
}

チーム開発での統一

プロジェクト設定の共有

言語設定をチームで統一

// .sublime-project
{
    "folders": [
        {
            "path": "."
        }
    ],
    "settings": {
        "default_line_ending": "unix",
        "tab_size": 4,
        "translate_tabs_to_spaces": true,
        "syntax_associations": {
            "*.dockerfile": "Packages/Dockerfile/Dockerfile.sublime-syntax",
            "*.env": "Packages/Dotfiles/Dotfiles.sublime-syntax"
        }
    }
}

よくある質問と解決方法

基本的な疑問

Q1. Sublime Textは日本語に対応しているの?

編集について

  • ファイル内容:完全対応、日本語の編集に問題なし
  • ファイル名:日本語ファイル名も正常に処理
  • 文字コード:UTF-8、Shift_JIS、EUC-JPに対応

インターフェースについて

  • メニュー:基本的に英語
  • 日本語化:「Japanize」プラグインで日本語メニューに変更可能
  • 入力支援:日本語IMEとの連携も良好

日本語化の手順

  1. Package Control → Install Package
  2. 「Japanize」を検索してインストール
  3. 再起動すると日本語メニューになる

Q2. コード補完はどの言語でも効くの?

基本的な補完

  • 単語補完:全言語で利用可能
  • スニペット:主要言語は標準搭載
  • 括弧補完:全言語で自動ペア入力

高度な補完

  • 関数補完:言語により差がある
  • 引数補完:LSPプラグインで大幅改善
  • インポート補完:専用プラグインが必要

言語別の補完レベル

言語基本補完高度補完推奨プラグイン
HTMLEmmet
CSSCSS3
JavaScriptLSP-typescript
PythonLSP-pyright
JavaLSP-java

Q3. Web制作と相性がいいのは本当?

HTML/CSS/JavaScript の強力サポート

Emmet による高速コーディング

<!-- 入力:ul>li*3>a -->
<!-- Tab押下で展開 -->
<ul>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
</ul>

CSS プロパティの充実した補完

  • プロパティ名の自動補完
  • 値の候補表示
  • ベンダープレフィックスの自動追加

JavaScript のモダン記法サポート

  • ES6+の新記法に対応
  • アロー関数、テンプレートリテラルの認識
  • 非同期処理(async/await)の構文ハイライト

技術的な問題

Q4. ファイルが文字化けして見える

原因と対策

文字コードの問題

  1. View → Show Console で文字コードを確認
  2. File → Reopen with Encoding → 適切な文字コードを選択
  3. 設定で默认文字コードを指定

BOM(Byte Order Mark)の問題

{
    "default_encoding": "UTF-8",
    "fallback_encoding": "Shift JIS"
}

Q5. 大きなファイルで動作が重い

対策方法

  1. シンタックスハイライトを無効化
    • 右下から「Plain Text」を選択
  2. ワードラップを無効化
    • View → Word Wrap をオフ
  3. ミニマップを非表示
    • View → Hide Minimap

Q6. プラグインが動作しない

確認項目

  1. Sublime Text のバージョン
    • プラグインの対応バージョンを確認
  2. 他のプラグインとの競合
    • 同種のプラグインを無効化
  3. 設定ファイルの文法エラー
    • JSONの記法が正しいか確認

学習・活用に関する疑問

Q7. 初心者はどの言語から始めるべき?

Web開発志向

  1. HTML:Webページの基本構造
  2. CSS:見た目の調整
  3. JavaScript:動的な処理

アプリ開発志向

  1. Python:文法が分かりやすい
  2. Java:企業での需要が高い
  3. Swift/Kotlin:モバイルアプリ開発

各言語でのSublime Text活用

  • 学習しやすい表示設定
  • エラーの早期発見
  • コード整形の自動化

Q8. 他のエディタからの移行は大変?

VS Code からの移行

  • ショートカット:多くが共通
  • プラグイン:同様の機能が利用可能
  • 設定:JSONベースで移行しやすい

Atom からの移行

  • パッケージ:多くがSublime Textでも利用可能
  • テーマ:類似デザインが豊富
  • 動作速度:Sublime Textの方が軽快

まとめ

Sublime Textの言語サポートについて、重要なポイントをまとめます:

標準サポートの充実

対応言語数

  • 80種類以上の言語に標準対応
  • Web開発からシステム開発まで幅広くカバー
  • マークアップ言語設定ファイルも充実

主要な機能

  • シンタックスハイライト:言語別の色分け表示
  • 自動インデント:適切な字下げの自動調整
  • 括弧対応:対になる括弧の表示
  • コード折りたたみ:長いコードの構造把握

柔軟な言語切り替え

自動認識

  • ファイル拡張子による自動判定
  • 内容による推測機能
  • プロジェクト設定での固定

手動切り替え

  • 右下の言語表示から即座に変更
  • コマンドパレットからの素早い切り替え
  • ショートカットによる効率的な操作

プラグインによる拡張性

Package Control での簡単インストール

  • 豊富なプラグインライブラリ
  • ワンクリックでの言語サポート追加
  • 自動アップデート機能

高度な機能追加

  • LSP対応でIDE並みの機能
  • 専門言語への対応
  • フレームワーク固有の機能

実用的な活用方法

学習での活用

  • 複数言語の比較学習
  • 同じエディタでの一貫した体験
  • 段階的なスキルアップ

業務での活用

  • マルチ言語プロジェクトでの統一環境
  • チーム開発での設定共有
  • 効率的なコード作成

コメント

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