vscodeカスタムvueテンプレートの実装

vscode エディタを使用して vue テンプレートを作成すると、新しい vue ファイルを作成するたびに特定のコード スニペットを繰り返す必要がなくなります。 vue と入力して Enter キーを押すと、カスタマイズされた vue ファイル コンテンツが生成されます。非常に使いやすく、開発効率が大幅に向上します。

vscode を開き、「ファイル」>「設定」>「ユーザー スニペット」を選択します。次に、表示される入力ボックスに「vue」と入力し、Enter キーを押します。 vue.json というファイルが開かれます。図に示すように:

対応するテンプレート コンテンツがイメージ コンテンツに追加されました。説明すると、プレフィックス フィールドはカスタム命令を表します。これは、vue ファイルに入力する vue タグです。Enter キーを押してカスタム ファイル コンテンツを生成します。本文にはカスタム コンテンツが含まれます。 \tはタブ文字で、主にコードの書式設定に使用します

vue テンプレートを作成したら、vue を通じてファイルを作成できます。以下のように表示されます。

コードの内容:

 「コンソールに印刷」: {
 「プレフィックス」: 「vue」、
 "体"： [
 "<!-- $0 -->",
 "<テンプレート>",
  "\t<div>",
  "",
  "\t</div>",
 "</テンプレート>",
 "",
 "<スクリプト>",
 "エクスポートデフォルト{",
    "\t名前: '',",
 "\tコンポーネント: {}",
 "\tデータ() {",
 "\treturn {",
 "\t}",
 "\t}",,
 "\tマウント（）{}",
 "\tメソッド: {}",
 "}",
 "</script>",
 "<style scoped='scss' scoped>",
 "</style>"
 ]、
 "description": "vue を vue-template に出力します"
  }

ここまで読んで、vue テンプレートが開発のための強力なツールだということがお分かりいただけたでしょうか? 非常にうまく機能します! ！ ！ ！ ！

これで、vscode カスタム vue テンプレートの実装に関するこの記事は終了です。より関連性の高い vscode カスタム vue テンプレートのコンテンツについては、123WORDPRESS.COM で以前の記事を検索するか、次の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。