VSCode code コマンド

Visual Studio Code では、code コマンドは VS Code をすばやく開き、コード関連の操作を実行するためのコマンドラインツールです。

code コマンドは、開発者がターミナルまたはコマンドプロンプトから直接 VS Code を起動したり、特定のタスクを処理したりするのに役立ちます。

最も一般的な方法は、次を使用することですcodeコマンドを使用してコマンドラインから直接ファイルディレクトリを開くことです。この場合、先に code コマンドをインストールする必要があります。

Windows システムに VS Code をインストールすると、code コマンドは自動的にシステム環境変数に登録されます。登録されていない場合は、VS Code のインストールパスを PATH 環境変数に手動で追加できます。

VSCode の code コマンドを有効にするのはとても簡単です。まずコマンドパレットを開きます:

  • macOS システムのショートカットキー:⇧⌘P(command + shift + p)
  • Windows/Linux のショートカットキー:Ctrl + Shift + P

インストールを検索 >shell command:

次に選択しますPATH に "code" コマンドをインストール - Shell Command: Install 'code' command in PATHこれでシステムの PATH パスにcodeコマンドの参照が追加されます。

コマンドラインを使用して、ファイルを開いたり、拡張機能をインストールしたり、表示言語を変更したり、診断情報を表示したりすることもできます。

以下は一般的なコマンドラインオプションです。次のコマンドで確認できます:code --helpコマンドで表示できます:

コマンドラインでは、次のコマンドを使用しますcode .コマンドを使用してフォルダーを VS Code で開くことができます:

コマンド機能の説明
code <路径>ファイルまたはフォルダーを開く
code .現在のディレクトリをワークスペースとして開く
code --new-window新しいウィンドウで開く
code --diff2つのファイルの内容を比較する
code --waitウィンドウが閉じるのを待ってからターミナルに戻る
code --disable-extensionsすべての拡張機能を無効にして VS Code を実行する
code --install-extension <扩展名>指定した拡張機能をインストールする
code --list-extensionsインストール済みのすべての拡張機能を一覧表示する
code --uninstall-extension <扩展名>指定した拡張機能をアンインストールする

code コマンドのよく使う機能

1. ファイルまたはフォルダーを開く

code <文件路径>

例えば app.js ファイルを開く場合:

code app.js

フォルダーを開く(ワークスペースとして):

code <文件夹路径>

例えば my-project フォルダーを開く場合:

code my-project

2. 新しいファイルを作成する

指定したファイルが存在しない場合、code はそのファイルを作成して開きます:

code newfile.js

3. 現在のディレクトリをワークスペースとして VS Code を開く

code コマンドを直接実行すると、現在のターミナルがあるディレクトリをワークスペースとして VS Code が起動します:

code .

4. ファイルを比較する

code コマンドはファイル内容の比較をサポートしています:

code --diff <文件1> <文件2>

例:

code --diff index.html index-backup.html

5. ヘルプを表示する

code コマンドのすべての利用可能なオプションを表示します:

code --help

code コマンドを使用して Vue プロジェクトを開く

Vue プロジェクトの作成

ターミナルまたはコマンドプロンプトを開き、次のコマンドを入力して Vue プロジェクトを作成します:

npm create vue@latest 

システムがプロジェクト名の入力を求めます。ここでは次のように入力しますサンプル-vue3-app:

Vue.js - The Progressive JavaScript Framework

? 请输入项目名称: › サンプル-vue3-app

その後、いくつかのオプションが表示されます。自分のニーズに合わせて選択するか、そのまま Enter キーを押し続けます:

Vue.js - The Progressive JavaScript Framework

> 请输入项目名称: … サンプル-vue3-app
> 是否使用 TypeScript 语法? … 否 / 是
> 是否启用 JSX 支持? … 否 / 是
> 是否引入 Vue Router 进行单页面应用开发? … 否 / 是
> 是否引入 Pinia 用于状态管理? … 否 / 是
> 是否引入 Vitest 用于单元测试? … 否 / 是
> 是否要引入一款端到端(End to End)测试工具? › 不需要
> 是否引入 ESLint 用于代码质量检测? › 否

正在初始化项目 /Users/サンプル/サンプル-vue3-app...

项目初始化完成,可执行以下命令:

  cd サンプル-vue3-app
  npm install
  npm run dev

プロジェクトの作成が完了したら、プロジェクトフォルダーに移動して依存関係をインストールします:

cd サンプル-vue3-app
npm install

依存関係のインストールにも数分かかる場合があります。

次のコマンドを入力して Vue アプリケーションをすばやく起動します:

npm run dev

ブラウザで http://localhost:5173 を開くと、次のように表示されます:

Ctrl+C を押すと vue-cli-service サーバーを停止できます。

code コマンドを使用して Vue プロジェクトを開く

ターミナルまたはコマンドプロンプトから作成した Vue プロジェクトフォルダー サンプル-vue3-app に移動し、次を使用しますcodeコマンドを使用してプロジェクトを VS Code で開きます:

cd サンプル-vue3-app
code .

VS Code が起動し、ファイルエクスプローラーに Vue プロジェクトが表示されます。次のように表示されます:

その他の拡張機能