この記事では、VSCode のいくつかの実用的なフロントエンド プラグインを要約し、推奨します。皆様のお役に立てれば幸いです。
生産性を確実に向上させる、フロントエンド開発に必須のプラグインを多数お勧めします。残りの時間を草刈りに費やすのもいいでしょう。その周り。 [推奨される学習: 「vscode チュートリアル 」]
##プラグイン名: Alias path Jump使用説明:Alias path Jump プラグイン、あらゆるプロジェクトをサポート、
使用シナリオ:ページを開発している場合、クリックする必要がありますエイリアス パス インポートされたコンポーネント (以下のデモ)
#プラグインを右クリックして、[拡張設定]-[パス マッピング]を選択し、
設定で編集します。 json<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">// 文件名别名跳转
"alias-skip.mappings": {
"~@/": "/src",
"views": "/src/views",
"assets": "/src/assets",
"network": "/src/network",
"common": "/src/common"
},</pre><div class="contentsignin">ログイン後にコピー</div></div>
パス エイリアス スマート プロンプト
シナリオ: コンポーネントをインポートするとき、
エイリアス パスを使用する場合はプロンプトが表示されませんindent-rainbow
機能: レインボー インデント
ブラケット ペア カラーライザー 2
プラグイン名:
プラグイン名:
Live ServerPP
Svg Preview
##Tabnine
機能: 対象となるコードを予測できるインテリジェントなコード プロンプト
テンプレート文字列コンバータ
vscode -pigments
Enter
Quokka new JavaScr..
関数: ソース コードを読み取って行をマークしてジャンプするためによく使用されます (コード マーク クイック ジャンプ)
機能: コード仕様チェック##機能: コードを美しくし、標準フォーマットに自動的にフォーマットします
関数、VSCode での作成者、変更時刻などの表示をサポートします。
ブラウザで開く
コード スニペット、開発に非常に便利です
React Style Helper
スタイルと変数定義の場所にジャンプ
スタイルと変数の内容のプレビューES7 React/Redux/React-Native/JS スニペット
React
コード スニペット、開発に非常に便利ですvscode-styled-components
JS
ファイルにスタイルを記述する場合、スマート プロンプト
その他の推奨事項
次のプラグインは一般的に使用されない可能性があります。興味があれば試してみてください。
機能: カーソルが
#アートボード描画
Echars スマート プロンプト プラグイン
使用法: プラグインのインストール後、
を入力してください関数:
翻訳プラグイン
使用法: 行を選択し、Ctrl Shift p 翻訳を入力
ユーザー文字列と変数の変換をサポート、キャメルケース分割をサポート
! !
以上がVSCode でおすすめの実用的なフロントエンド プラグイン (概要)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。