VSCode CLI ツールを簡単に分析すると、非常に便利であることがわかりました。

vscode CLI ツールといえば、日常業務では必要ないため馴染みがないかもしれません。しかし、その機能の一部は非常に実用的であり、私の最近の技術的アイデアのいくつかはそれを使用して実現できるため、この記事では VSCode CLI の実用的な機能について説明します。 [推奨学習:「vscode 入門チュートリアル 」]

VSCode CLI のシェル コマンドは code と呼ばれ、code は後で使用します。 VSCode CLI ツールを参照します。

コード実践関数

最新のセッションを開く

コードオプションやパラメータの実行なしVSCode の最新のセッションが開きます。たとえば、最近 projectA を開いた場合、projectA が他のウィンドウで覆われているか、VSCode を終了したかに関係なく、次のコマンドで projectA をすぐに開くことができます。

$ code

シェルを使用している場合、このコマンドは、VSCode をすばやく開いたり、編集したばかりのファイルを見つけたりするのに役立ちます。

特定のプロジェクトを開く

ここで、通常、VSCode を使用してプロジェクトを開く方法についてお聞きしたいのですが、次の手順に従っていますか?

• VSCode アイコンをクリックします。

• メニュー バーの「ファイル」をクリックします。

• 「開く」をクリックします。

• Mac の Finder で見つけて開きます

私はそうではありません。シェルの使用には慣れており、コマンド ラインだと思います。操作は Finder で検索するよりも高速です。

code . コマンドは私がよく使うもので、VSCode の現在のディレクトリにあるプロジェクトをすぐに開くことができます。

すべてのプロジェクトは固定ディレクトリに配置されているため、最初に cd でプロジェクト ディレクトリに移動し、その後 code . を実行するだけです。

もちろん、code <folder> を使用してプロジェクトを開くこともでき、効果は同じです。

ファイルの行にジャンプします

##code -g ::コマンドは次のことができます。 be fast ファイルの特定の行の特定の文字にジャンプします。たとえば、次のコマンドは index.ts ファイルを開き、文字 index が 8 になる前の 18 行目にカーソルを置きます。

$ code -g /project-path/src/index.ts:18:8

react-dev-inspector や vue-devtools などの一部の現在の開発ツールでは、開発者は DOM 要素をクリックして開き、VSCode 内でそれらの要素を検索できます。対応するソースコードの場所。原則として、開発サーバーの実行中にソース コードの位置情報を取得し、それを DOM 要素に挿入します。その後、開発者が DOM をクリックすると、位置情報が開発サーバーに送信され、開発サーバーは次の呼び出しを行います。 code ソース コードにジャンプする機能。

ファイル比較

2 つのファイルを簡単に比較したい場合は、次のコマンドを使用できます:

$ code -d file-path-a file-path-b

このペアは VSCode の使用に慣れていますファイルの違いを比較するため、競合を解決する学生にとってはより役立つかもしれません。

プラグイン操作

これは私が最近発見したお気に入りの機能で、次の点が含まれます:

• code --list -extensions --show-versions: インストールされているすべてのプラグインを .@;
• コードの形式で一覧表示します。 --install-extension : プラグインをインストールするには、--force オプションを追加して、ポップアップ プロンプトが表示されないようにすることができます。 code --uninstall-extension <ext>: プラグインをアンインストールします。
• フロントエンド エンジニアリングの足場を開発するように頼まれたら、どうしますか?
市場のほとんどのスキャフォールディングを模倣し、もちろん editorConfig、eslint、prettier などのコード形式に関連する構成をユーザーに提供します。しかし、これらを完了しても、足場は 90 点しか獲得できません。実際、eslint を有効にするには、ユーザーは対応する VSCode プラグインをインストールし、

settings.json

を構成する必要があります。

settings.json 幸いなことに、

.vscode

ディレクトリに settings.json を作成して、チーム メンバー間で構成を共有し、ローカル構成を上書きできます。により、チーム メンバーが手動構成の手間を省き、一貫性のない開発構成の問題を回避できます。 VSCode プラグインに関しては、一般的に、ユーザーが自分でインストールできるようにするか、デフォルトですでにインストールされています。しかし、フロントエンドの初心者や新しい同僚にとって、これは間違いなく苦痛であり、優れたスキャフォールディング開発者にとっても耐え難いものです。このとき、上記のコマンドが機能します。

--list-extensions

ユーザーがプラグインをインストールしているかどうかを確認し、インストールされていない場合は、

--install-extension

を使用してインストールします。 <p>プラグインと <code>.vscode を操作するための上記のコマンドの助けを借りて、スキャフォールディングはユーザーがまったく意味を持たずに開発環境を構成するのに役立ち、すべてのユーザーが確実に開発環境を構成できるようにすることができると考えられます。はい、いつか新しい同僚がやって来て、彼の eslint が有効になっていないと言うかもしれない、という心配はありません。

注: プラグインの操作に関連するコマンドは少し強力なので、注意して使用してください。

コードのインストール

一部の学生は、コードを効果的にするには、手動でコード# #をインストールしてはいけないと言うかもしれません。 #コマンドはグローバル環境変数 PATH にインストールされていますか?

これは Mac では次のようになりますが、パス

/Applications/Visual Studio Code.app/Contents/Resources/app/bin/code を通じて code を直接呼び出すこともできます。 。

Windows および Linux システムの場合、VSCode がインストールされると

code が PATH に自動的に追加され、code を直接呼び出すことができます。

したがって、スキャフォールディングをカプセル化して、ユーザーが環境変数を手動で追加できないようにすることができます。

まとめ

この記事では、VSCode CLI の実用性が高いと思われる一部の機能のみを紹介しており、言語の切り替えやパフォーマンス監視などのその他の機能は紹介しておりません。記事末尾のインフォメーションのリンクから公式サイトに飛んでご覧いただけます。

最近、私は他のノード プロジェクトを直接呼び出すための基本機能のセットを提供したいと考えて、

code 関連コマンドを単純にカプセル化しています。プロジェクトのアドレスは github.com です。 /avennn/vsc -…、どなたでもご利用、PRしていただけます。良いと思ったら星を付けていただけると嬉しいです。

VSCode の詳細については、

vscode チュートリアル をご覧ください。

以上がVSCode CLI ツールを簡単に分析すると、非常に便利であることがわかりました。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。