VSCodeのインテリセンスにプラグイン関数を認識させる方法

VSCodeを使ってWordPressのテーマ制作をしていると、プラグイン固有の関数を使用することがよくあります。 しかし、VSCodeではこれらの関数を認識できず、構文エラーとして表示されてしまいます。

今回は、スタブファイルを作成してVSCodeにプラグイン関数を認識させる方法をご紹介します。

よく使われるプラグイン関数の例

WordPressテーマ制作でよく使用されるプラグイン関数をまとめました。

問題点：VSCodeでの認識エラー

エラーの発生理由

VSCodeではプラグイン固有の関数を認識できないため、以下のような問題が発生します。

• 構文エラー表示：赤い波線でエラーとして表示される
• インテリセンス機能の阻害：特にPHP Intelephense拡張機能使用時
• 実際の動作には問題なし：サイト表示は正常に動作する

実際のエラー表示例

<?php
// Smart Custom Fieldsプラグインの関数 - エラーとして表示される
$value = SCF::get('field_name');

// その他のプラグイン関数も同様にエラー表示
$breadcrumb = bcn_breadcrumb_trail::get();
$seo_title = WPSEO_Frontend::get_instance()->title();
?>

<?php
// Smart Custom Fieldsプラグインの関数 - エラーとして表示される
$value = SCF::get('field_name');

// その他のプラグイン関数も同様にエラー表示
$breadcrumb = bcn_breadcrumb_trail::get();
$seo_title = WPSEO_Frontend::get_instance()->title();
?>

解決方法：スタブファイルの作成

スタブとは？

スタブ（stub）とは、実際の処理は行わないが、関数やクラスの「型」だけを定義したファイルのことです。 VSCodeのインテリセンス機能に「この関数は存在する」と認識させるために使用します。

実例：Smart Custom Fieldsプラグインのスタブ作成

Smart Custom FieldsプラグインのSCF::get()関数を例に、スタブ作成の手順を解説します。

ステップ1：フォルダ構造の作成

テーマフォルダ内に以下の構造を作成します。

sample-theme
├── style.css
├── index.php
└── .vscode
    ├── stubs
    │   └── scf.php
    └── settings.json

sample-theme
├── style.css
├── index.php
└── .vscode
    ├── stubs
    │   └── scf.php
    └── settings.json

ステップ2：スタブファイルの作成

.vscode/stubs/scf.phpファイルを作成し、以下のコードを記述します。

<?php
/**
 * Smart Custom Fields スタブファイル
 * VSCode用の型定義
 */
class SCF {
    /**
     * カスタムフィールドの値を取得
     * @param string $field フィールド名
     * @param int|null $post_id 投稿ID
     * @return mixed
     */
    public static function get($field, $post_id = null) {
        return null;
    }

    /**
     * 複数のカスタムフィールド値を取得
     * @param string $field フィールド名
     * @param int|null $post_id 投稿ID
     * @return array
     */
    public static function gets($field, $post_id = null) {
        return [];
    }
}
?>

<?php
/**
 * Smart Custom Fields スタブファイル
 * VSCode用の型定義
 */
class SCF {
    /**
     * カスタムフィールドの値を取得
     * @param string $field フィールド名
     * @param int|null $post_id 投稿ID
     * @return mixed
     */
    public static function get($field, $post_id = null) {
        return null;
    }

    /**
     * 複数のカスタムフィールド値を取得
     * @param string $field フィールド名
     * @param int|null $post_id 投稿ID
     * @return array
     */
    public static function gets($field, $post_id = null) {
        return [];
    }
}
?>

ステップ3：VSCode設定ファイルの作成

.vscode/settings.jsonファイルを作成（または編集）し、以下の設定を追加します。

{
    "intelephense.environment.includePaths": [
        "./.vscode/stubs"
    ]
}

{
    "intelephense.environment.includePaths": [
        "./.vscode/stubs"
    ]
}

その他のプラグインスタブ例

<?php
/**
 * Yoast SEO スタブファイル
 * VSCode用の型定義
 */
class WPSEO_Frontend {
    /**
     * インスタンスを取得
     * @return WPSEO_Frontend
     */
    public static function get_instance() {
        return new self();
    }
    
    /**
     * SEOタイトルを取得
     * @return string
     */
    public function title() {
        return '';
    }
    
    /**
     * メタディスクリプションを取得
     * @return string
     */
    public function metadesc() {
        return '';
    }
}
?>

<?php
/**
 * Yoast SEO スタブファイル
 * VSCode用の型定義
 */
class WPSEO_Frontend {
    /**
     * インスタンスを取得
     * @return WPSEO_Frontend
     */
    public static function get_instance() {
        return new self();
    }
    
    /**
     * SEOタイトルを取得
     * @return string
     */
    public function title() {
        return '';
    }
    
    /**
     * メタディスクリプションを取得
     * @return string
     */
    public function metadesc() {
        return '';
    }
}
?>

<?php
/**
 * Breadcrumb NavXT スタブファイル
 * VSCode用の型定義
 */
class bcn_breadcrumb_trail {
    /**
     * パンくず配列を取得
     * @return array
     */
    public static function get() {
        return [];
    }
    
    /**
     * パンくずを表示
     * @return string
     */
    public function display() {
        return '';
    }
}
?>

<?php
/**
 * Breadcrumb NavXT スタブファイル
 * VSCode用の型定義
 */
class bcn_breadcrumb_trail {
    /**
     * パンくず配列を取得
     * @return array
     */
    public static function get() {
        return [];
    }
    
    /**
     * パンくずを表示
     * @return string
     */
    public function display() {
        return '';
    }
}
?>

<?php
/**
 * Contact Form 7 スタブファイル
 * VSCode用の型定義
 */
class WPCF7_ContactForm {
    /**
     * フォームインスタンスを取得
     * @param int $id フォームID
     * @return WPCF7_ContactForm
     */
    public static function get_instance($id) {
        return new self();
    }
    
    /**
     * フォームタイトルを取得
     * @return string
     */
    public function title() {
        return '';
    }
}
?>

<?php
/**
 * Contact Form 7 スタブファイル
 * VSCode用の型定義
 */
class WPCF7_ContactForm {
    /**
     * フォームインスタンスを取得
     * @param int $id フォームID
     * @return WPCF7_ContactForm
     */
    public static function get_instance($id) {
        return new self();
    }
    
    /**
     * フォームタイトルを取得
     * @return string
     */
    public function title() {
        return '';
    }
}
?>

設定後の確認方法

インテリセンスの動作確認

1. VSCodeの再起動
   • 設定を反映させるためVSCodeを再起動
2. 構文エラーの消失確認
   • プラグイン関数の赤い波線が消える
   • エラー表示がなくなる
3. オートコンプリート機能の確認
   • SCF::と入力すると候補が表示される
   • 関数の引数情報も表示される

複数プラグインの統合管理

基本設定

{
    "intelephense.environment.includePaths": [
        "./.vscode/stubs"
    ]
}

{
    "intelephense.environment.includePaths": [
        "./.vscode/stubs"
    ]
}

この設定により、.vscode/stubsフォルダ内のスタブファイルがインテリセンスに読み込まれます。

スタブファイルは軽量なので、通常はこの設定だけで十分です。

スタブファイルの整理

sample-theme
├── style.css
├── index.php
└── .vscode
    ├── stubs
    │   ├── scf.php              # Smart Custom Fields
    │   ├── yoast.php            # Yoast SEO
    │   ├── breadcrumb-navxt.php # Breadcrumb NavXT
    │   ├── contact-form-7.php   # Contact Form 7
    │   └── acf.php              # Advanced Custom Fields    
    └── settings.json

sample-theme
├── style.css
├── index.php
└── .vscode
    ├── stubs
    │   ├── scf.php              # Smart Custom Fields
    │   ├── yoast.php            # Yoast SEO
    │   ├── breadcrumb-navxt.php # Breadcrumb NavXT
    │   ├── contact-form-7.php   # Contact Form 7
    │   └── acf.php              # Advanced Custom Fields    
    └── settings.json

重要：スタブは実際の動作と無関係

スタブファイルはVSCodeの構文エラー回避専用のテクニックです。

• 実際のWordPressサイトの動作には一切影響しない
• プラグインの本来の機能とは完全に独立している
• あくまでエディタ上での構文エラー表示を消すことが目的
• 処理の正確性は保証されない：実際のプラグインの仕様と異なる場合がある
• プラグインのアップデートで不整合が発生する可能性：パラメーター数や型が変更される場合がある

注意点とベストプラクティス

重要な注意点

• 実行されることはない：型情報をエディタに教えるためだけのファイル

ベストプラクティス

1. 必要な関数のみ定義
   • 使用しない関数まで定義する必要はない
   • シンプルに保つ
2. PHPDocコメントの活用
   • 引数や戻り値の型情報を記載
   • インテリセンスの精度向上
3. 定期的なメンテナンス
   • プラグインのアップデートに合わせてスタブも更新
   • 不要になったスタブは削除

まとめ

VSCodeでWordPressプラグイン関数を認識させるスタブ作成方法をご紹介しました。

設定のポイント再確認：

• .vscode/stubs/フォルダにスタブファイルを配置
• settings.jsonでincludePathsを設定
• 必要な関数のみをシンプルに定義

この設定により、VSCodeでの開発体験が格段に向上し、構文エラーに悩まされることなくWordPressテーマ制作に集中できるようになります。

ぜひスタブファイルを作成して、より快適なWordPress開発環境を構築してみてください！

この投稿をシェアする