VSCode をより良く使用するにはどうすればよいですか? VSCode 初心者ガイドの共有

vscode を 10 倍改善するにはどうすればよいですか?次の記事では、VS Code の初心者ガイドを紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

#関連する推奨事項: 「

vscode チュートリアル 」

「VS Code は非常に使いやすく、コードを書くのが楽しいです。」

あなたの周囲で複数の人がこのようなことを言っているのを聞いたことがあるはずです。最近の JS 2019 レポートでも、

VS Code が圧倒的な優位性で 1 位を獲得しました 、他のエディターは容赦なく打ち砕かれ、地面にこすられるしかありませんでした...

JS 2019 Report

ただし、VS Code は PyCharm/WebStorm のようにすぐに使用できるわけではないため、スムーズに使用するには追加のプラグインをインストールし、いくつかのショートカット キーとスキルを習得する必要があります。

私たちは 1 週間かけて、おそらく最も包括的な VS Code の初心者向けガイドを作成しました。このガイドは 3 つの部分に分かれています: ショートカット キーのチート シート、10 個の非常に使いやすいプラグイン、 Bai はすぐに使い始められ、効率が 2 倍になります。

# ショートカット キーのチートシート

#最初に、

VS Code でよく使用されるショートカット キーの 2 つのクイック キーをまとめました。表の上部:

Mac ショートカット キー

Windows/Linux ショートカット キー
ショートカットに精通している場合のみキーは、VS Code がいかに便利であるかを発見できますか。本物の達人はキーボードから手を離さずにコードを書きます。

## 超便利なプラグイン 10 個

#中国語 (簡体字) Visual Studio Code 用言語パック

‍ Microsoft3,358,698 ダウンロード

インストール後

1 秒で VS コードを中国語化

、その後英語が読めなくても心配しないでください。

##街の明かりのテーマ

‍ おいしいガム 54,054ダウンロード

##これは良いテーマ プラグインですが、テーマの選択は人によって異なります。

で「テーマ」を直接検索して、多数のテーマ プラグインを入手することもできます。テーマ

、自分に合ったものを見つけてください。

##美化

##‍ HookyQR 3,998,071 ダウンロード

マークを拡大したり、コードの間隔を調整したり、コードをすばやく整形したりすることができます。これにより、乱雑な HTML、CSS、および JS コードを即座に整理でき、他の人にとっても便利になります。メンテナンス後、お読みください。

vscode-icons

##‍ VSCode Icons チーム

4,237,487 ダウンロード

ファイルアイコンを設定します。さまざまな種類のファイルに応じて、

対応するファイルアイコンを設定します。ファイルリストを見ると、一目ではっきりとわかり、必要なファイルをすぐに見つけることができます(特にファイルや種類が多い場合はよくあります)。

画像プレビュー

‍ タマスにキス

123,990 ダウンロード

画像パス上にカーソルを置くと画像プレビューが表示されるので、コードを入力すると、正しいかどうかがすぐにわかります。画像または画像が参照されました。アイコン。

コード スペル チェッカー

‍ ストリート サイド ソフトウェア

970,955 ダウンロード

毎日のコードの多くの名前には英語の単語が使用されています。不注意な友人がスペルを間違える可能性があります。このプラグインは、単語のスペルが間違っている場合の救済ツールです。間違った単語をマークすることができます、またという単語の正しいスペルを入力するよう求めます。これにより、単語のスペルミスによるバグを長い間見つける必要がなくなります

Live Server

##‍ Ritwick Server

3,551,236 ダウンロード

フロントエンド開発を行う場合、ブラウザを開いてページをプレビューおよびデバッグする必要があります。このプラグインは、静的ページと動的ページのリアルタイム プレビューを実現できます。

保存すると、ページの更新が表示されます。手動で更新する必要はありません。

indent-rainbow‍ oderwat

567,061 ダウンロード

##コードを記述するとき、インデントが適切に配置されているかどうかを確認するメッセージが表示されます。

各ステップで 4 つの異なる色を交互に使用します。インデントが適切に配置されていない場合は、色が赤になります

, watch コードがすっきりしていてとても快適です。

レインボー ブラケット

‍ 2gua# #ダウンロード数 #367,290

# 丸括弧、角括弧、および曲線括弧に色を指定します;

同じ色は同じレベルの括弧を示します

、孤立した右括弧は赤色で強調表示され、JavaScript を書く人に適していますの方が便利です。

Polacode-2019

‍ ジェフ・ハイキン 4,704 ダウンロードコードを美しい画像として保存できます。テーマも異なり、コードの配色も異なります。枠線の色、サイズ、影を自分で設定することもできます。

チュートリアルまたはドキュメント コード例を提供すると役に立ちます

。

#● VS Code 初心者向けチュートリアル

① VS Code をインストールするVS Code 公式ダウンロードアドレス: https://code.visualstudio.com

お使いのコンピュータに応じて、対応するバージョンをダウンロードし、インストールしてください。

#② VS コードを入力します

インターフェースは次の部分に分かれています。まず各部分が何をするのか全体的に理解してください

#③ VS Code プラグインをインストールします

#上記の非常に使いやすいプラグインは、ここからインストールできます。 。

④ コードの作成を開始します

まずコンピューター上に新しいフォルダーを作成します

#次にこのフォルダーを開きますVScode では

ショートカット キー (Command/Ctrl O) を押すこともできます

#新しいファイルを作成します (Command/Control N)、

は、VScode がファイルの種類を識別できるように、サフィックス

を記述する必要があります。

⑤ コードの実行を開始します

コードを編集して保存し、上記で推奨されている Live Server プラグイン プレビューを使用します。プラグインをインストールした後、

右クリックして「ライブサーバーで開く」を選択します。開くか、クリック 「ライブに移行する」

右下隅にあります。

プログラミング関連の知識について詳しくは、

プログラミング ビデオ

をご覧ください。 ！

以上がVSCode をより良く使用するにはどうすればよいですか? VSCode 初心者ガイドの共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。