序章

Visual Studio Code は、 VS Code とも呼ばれ、すべての主要なオペレーティングシステムで利用できる無料のソースコードエディター(または統合開発環境(IDE))です。

多くのプログラミング言語用の拡張機能の大規模なコレクションを備えたVSCodeは、さまざまな開発ニーズに対応するようにカスタマイズできます。 このガイドでは、PHPプロジェクトで作業するためのVisualStudioCodeをセットアップする方法を学習します。

The gif shows the VS Code interface for PHP development

前提条件

このガイドに従うには、オペレーティングシステムに適したバージョンの Visual StudioCodeをダウンロードしてインストールする必要があります。

このガイドの手順は、Ubuntu 20.04デスクトップコンピューターで検証されていますが、VSCodeでサポートされているすべてのオペレーティングシステムでシームレスに機能するはずです。 ただし、MacOSシステムとの互換性のために、キーボードショートカットキーを少し変更する必要がある場合があることに注意してください。

ステップ1—追加サポートのためのVSCodePHP拡張機能のインストール

インストール直後、VS CodeはすでにPHPコードを認識しており、構文の強調表示、基本的なデバッグ、およびコードのインデントに役立ちます。 これらの機能は、すばやく編集したり、個々のPHPスクリプトを操作したりする場合に適しています。 ただし、大規模なプロジェクトでの作業は、コードに関するコンテキストや、各ファイルが大規模なプロジェクト内でどのように相互作用および統合されるかがなければ、困難になる可能性があります。

PHPプロジェクトで作業する際の生産性を向上させるのに役立つVSCode拡張機能がいくつかあります。 このガイドでは、 PHP Intelephense をインストールしてセットアップします。これは、VS Codeの人気のあるPHP拡張機能であり、コード補完の改善、コンポーネント間のナビゲーションの改善、マウスホバーでの豊富な情報ツールチップなどのいくつかの高度な機能を提供します。コードの自動フォーマット、および静的コード分析に基づくリアルタイムのエラー報告。

左側のメニューバーの最後のアイコンをクリックするか、CTRL + SHIFT + Xを押して、拡張機能タブを開きます。 これにより、検索ボックスと人気のあるまたは推奨される拡張機能のリストを含むサイドバーメニューが表示されます。 「php」または「intelephense」と入力して、PHPIntelephense拡張機能を見つけます。 インストールボタンをクリックして、拡張機能をインストールして有効にします。

The gif shows how to access the extensions menu on the left sidebar

インストールが完了すると、Intelephenseの公式ドキュメントは、VSCodeに付属する組み込みのPHP言語機能拡張機能を無効にすることを推奨します

この拡張機能を無効にするには、 Extensions検索ボックスに@builtin phpと入力して、組み込みのPHP拡張機能を見つけます。 次に、 PHP言語機能拡張機能の設定アイコンをクリックし、ドロップダウンメニューの無効オプションをクリックします。

The gif shows how to disable the builtin PHP Language Features extension

VS Codeで開いているファイルがある場合は、変更を適用するためにエディターをリロードする必要があります。

PHP Intelephense拡張機能について説明したのと同じプロセスに従って他の拡張機能をインストールできますが、一部の拡張機能では、システムに追加のソフトウェアをインストールする必要があることに注意してください。 拡張機能のドキュメントをチェックして、要件が適切に設定されていることを確認してください。

ステップ2—新しいPHPプロジェクトのインポートまたは作成

既存のPHPプロジェクトをVSCodeにインポートするには、左側のメニューバーの最初のアイコンをクリックするか、CTRL + SHIFT + Eと入力してファイルエクスプローラーにアクセスします。 フォルダを開くボタンをクリックして、プロジェクトのディレクトリを選択します。 新しいプロジェクトを作成する場合は、新しいフォルダを作成して、それをプロジェクトディレクトリとして選択できます。

The gif shows how to import a PHP project to VS Code

エクスプローラウィンドウにプロジェクトのディレクトリツリーが表示され、プロジェクトのファイルとディレクトリにすばやくアクセスできます。

ステップ3—テーマとエディターフォントのカスタマイズ(オプション)

必須ではありませんが、エディターの外観をカスタマイズして、長期間使用しやすくすることをお勧めします。 開発者として、VS CodeなどのIDEを毎日数時間見ることがあります。そのため、エディターフォントが適切なサイズであるかどうかを確認することが重要です。コントラストは、目を疲れさせずに読みやすくするのに十分です。 。

自分に合ったカスタム設定を見つけるために、さまざまなテーマやフォントを試してみることをお勧めします。

VSCodeテーマの変更

VS Codeには、エディターインターフェイスとコードの強調表示で使用される色を変更できるいくつかの異なるテーマが付属しています。 デフォルトでは、暗いスタイルと明るいスタイルの両方が含まれています。

ファイル->設定->カラーテーマに移動するか、CTRL + K + Tと入力して、VSCodeの別のテーマを選択します。

The gif shows how to change VS Code theme

テーマ拡張機能をインストールして、VSCodeの外観をさらにカスタマイズすることもできます。 拡張機能タブ(CTRL + SHIFT + X)内でthemeを検索すると、他の人気のあるエディターやプラットフォームから移植された配色など、さまざまなスタイルや色のテーマ拡張機能がいくつか見つかります。

フォントの調整

多くのユーザーにとって、デフォルトのVS Codeフォント設定で十分ですが、読みやすくするためにエディターフォントのサイズとタイプを調整することをお勧めします。

フォントサイズを変更したり、別の種類に変更したりする場合は、ファイル->設定->設定に移動し、を選択します。左側のメニューにあるテキストエディタ。 次に、開いたサブメニューのフォントをクリックします。 このセクションには、必要に応じて微調整できるフォントファミリとサイズ設定が含まれています。

The gif shows how to change VS Code editor font size

変更はすぐに保存され、現在開いているすべてのファイルに適用されます。

結論

Visual Studio Codeは、ほとんどの開発者のニーズに合わせてカスタマイズできる、軽量でありながら強力なコードエディターです。 このガイドでは、PHPプロジェクトでの作業中に追加サポートのためにPHP Intelephense拡張機能をインストールおよび構成する方法、VS Code内で新しいプロジェクトをインポートおよび作成する方法、およびより快適なコーディングエクスペリエンスのためにエディターの外観をカスタマイズする方法を学習しました。

Visual Studio Codeのその他のチュートリアルについては、VSコードタグページを確認してください。 PHP開発の詳細については、 PHPシリーズのコーディング方法を参照して言語の概要を確認し、PHPタグページを参照してPHPの詳細を確認してください。チュートリアル。