ホームページ  >  記事  >  開発ツール  >  vscode でよく使用されるプラグインは何ですか?

vscode でよく使用されるプラグインは何ですか?

青灯夜游
青灯夜游オリジナル
2019-12-28 17:32:1210979ブラウズ

vscode (Visual Studio Code) は、構文の強調表示、インテリジェントなコード補完、カスタム ホットキー、ブラケット マッチング、およびほぼすべての主流開発言語のコード スニペットをサポートする、無料のオープン ソースの最新の軽量コード エディターです。コード比較 Diff、GITなどの機能を備え、プラグイン拡張機能をサポートし、Web 開発およびクラウド アプリケーション開発に最適化されています。

vscode でよく使用されるプラグインは何ですか?

vscode プラグインをインストールするには、図に示されているボタンをクリックして拡張子を入力するだけです。検索ボックスで [インストール] をクリックし、インストールが完了するまで待ちます。 [再読み込み] をクリックして vscode を再起動し、プラグインを有効にします。

特定のプラグインが必要ない場合は、拡張子を入力し、対応するプラグインの右下隅にある歯車ボタンをクリックして、プラグインを無効にするかアンインストールするかを選択するだけです。で。

vscode で一般的に使用されるプラグインは何ですか?

#プラグイン手順備考##自動終了タグタグの名前を自動変更します##美化コードの書式設定 ##ブラケットペア カラーライザーカラー識別マッチング ブラケットコード ランナー非常に強力なプラグインで、次のことが可能です。複数の言語でコード スニペットまたはコード ファイルを実行します: C、C、Java、JavaScript、PHP、Python、Perl、Ruby、Go など。 change-caseVSCode にはすぐに使える組み込みのテキスト変換オプションがありますが、テキストを上位と下位にのみ変換できます。場合。このプラグインは、キャメルケースの命名、アンダースコアで区切られた命名、スネークケースの命名、CONST_CAS の命名など、テキストを変更するための命名形式を追加します。 中文簡体字言語パック これ便利なプラグインは、CSS で使用する色に関する情報を提供します。カラーの上にカーソルを置くだけで、カラー ブロック内のカラー モデル (HEX、RGB、HSL、CMYK) の関連情報をプレビューできます。このプラグインを使用すると、スタイル シート内の CSS クラスと ID が定義されている場所を追跡できます。 HTML ファイル内のセレクターを右クリックし、[定義に移動して定義を表示] オプションを選択すると、スタイル # の CSS コードが送信されます。 フロントエンド デバッグ、使用状況の表示##ESLint#filesize現在のファイル サイズが下部のステータス バーに表示されます。クリックすると、詳細な作成時間と変更時間も確認できますGit 履歴Git ログをグラフとして表示GitLens — Git のスーパーチャージ ファイルの最新のコミットと作成者を表示し、現在の行のコミット情報を表示しますHTML ボイラープレートWith HTML テンプレート プラグインを使用すると、新しい HTML ファイルのヘッダー タグやボディ タグを書き換える手間が省けます。空のファイルに html を入力し、Tab キーを押すだけで、きれいなドキュメント構造が生成されます#HTMLHint#HTML スニペットコードの自動入力選択した HTML タグの外側にタグのレイヤーをラップします"Alt W" (Mac の場合は "Option W")マウスをパスに移動して画像プレビューを表示します現在のインデントの深さを強調表示します##HTML 内の CSS クラス名の IntelliSense を表示します#JavaScript (ES6) コード スニペットes6 コード スニペットライブ サーバーブラウザのリアルタイム更新ノード。 js モジュール Intellisense JavaScript/TypeScript モジュールをオートコンプリートできますnpm Intellisenseインポート ステートメント パッケージに必要プロンプトパス Intellisenseパスの自動補完##Quokka.jsQuokka は、作成中のコードに基づいてリアルタイムのフィードバックを提供するデバッグ ツール プラグインです##Regex Previewerこれはリアルタイム テストです 正規表現用のユーティリティ。開いているファイルに正規表現パターンを適用し、一致するものをすべて強調表示します#SVG ViewerVetur(ESLint プラグインを使用するとより効果的)##vscode-fileheader一番上のコメントテンプレートでは作成者、時刻、その他の情報を定義でき、最終変更時刻が自動的に更新されます。 (デフォルトの情報は、[ファイル]→[環境設定]→[設定]で変更できます)関連する推奨事項: vscode 入門チュートリアル
HTML/XML 終了タグを自動的に追加します
ペアになった HTML/XML タグの名前を自動的に変更します

インストールが完了すると、右上隅が表示されます: ▶
# # Visual Studio Code の中国語 (簡体字) 言語パック

カラー情報
CSS Peek
##Chrome 用デバッガー
EsLint は、JavaScript プログラミングの構文エラーをチェックするのに役立ちます。たとえば、JavaScript アプリケーションでは、リークした変数やメソッドを見つけるのが困難です。 EsLint は、JS コードを分析し、バグを発見し、JS 構文の記述がある程度正確であることを確認するのに役立ちます
HTML コード形式の検出
##htmltagwrap

##画像プレビュー
識別子
##CSS ファイルに配置しますプロジェクト内 html の名前スニペット

使用法: Ctrl SHIFT P quokka と入力し、新しい JavaScript を選択します
このプラグインは、多くの便利な SVG を追加しますプログラムを Visual Studio Code に変換すると、エディターを離れることなく SVG ファイルを開いて表示できるようになります。また、PNG 形式に変換し、データ URI パターンを生成するためのオプションも含まれています
Vue 構文ハイライト表示、構文エラーチェック、コードの自動補完

ショートカット キー: Ctrl Alt i

以上がvscode でよく使用されるプラグインは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。