VSCDE構成vueテンプレート
2694 ワード
VSCode-vueプロジェクト、カスタマイズ.vueテンプレート
1.vscodeのインストール
vscode公式サイトアドレス:
2.vueファイルを識別するプラグインをインストールする
プラグインライブラリでVeturを検索し、インストールをクリックし、インストールが完了したら再ロードをクリックします.
3.新規コードクリップ
ファイル-->プリファレンス-->ユーザーコードクリップ-->新規コードクリップをクリック--vueと名前を付けます.json OK
4.不要なコードを削除し、自分で書いたものに貼り付ける.vueテンプレート
注意テンプレートファイルでインデントしたい箇所はTABは使用できません.スペースに置き換える必要があります.
5.vscodeを再起動する.
6.使用
上のコードの「prefix」:「vue」は、ショートカットキーです.保存してから、新規作成します.vueの最後のファイル.このとき新しく作成されたvueは空白のファイルです.この空白ファイルにvue+tabを入力すると、カスタムvueテンプレートが自動的にロードされます.
1.vscodeのインストール
vscode公式サイトアドレス:
2.vueファイルを識別するプラグインをインストールする
プラグインライブラリでVeturを検索し、インストールをクリックし、インストールが完了したら再ロードをクリックします.
3.新規コードクリップ
ファイル-->プリファレンス-->ユーザーコードクリップ-->新規コードクリップをクリック--vueと名前を付けます.json OK
4.不要なコードを削除し、自分で書いたものに貼り付ける.vueテンプレート
注意テンプレートファイルでインデントしたい箇所はTABは使用できません.スペースに置き換える必要があります.
{
"Print to console": {
"prefix": "vue",
"body": [
"",
"",
" $5",
"",
"",
"",
" //api ",
" /**",
" * @api {get} /user/:id Request User information",
" * @apiName GetUser",
" * @apiGroup User",
" *",
" * @apiParam {Number} id Users unique ID.",
" *",
" * @apiSuccess {String} firstname Firstname of the User.",
" * @apiSuccess {String} lastname Lastname of the User.",
" */",
" ",
"export default {",
" ",
" components: {},",
" data() {",
" ",
" return {",
" ",
" };",
" },",
" // data ",
" computed: {},",
" // data ",
" watch: {},",
" ",
" methods: {",
" ",
" },",
" // - ( this )",
" created() {",
" ",
" },",
" // - ( DOM )",
" mounted() {",
" ",
" },",
" beforeCreate() {}, ",
" beforeMount() {},",
" beforeUpdate() {}, ",
" updated() {}, ",
" beforeDestroy() {}, ",
" destroyed() {}, ",
" // keep-alive , ",
" activated() {}, ",
" }",
" ",
""
],
"description": "Log output to console"
}
}
5.vscodeを再起動する.
6.使用
上のコードの「prefix」:「vue」は、ショートカットキーです.保存してから、新規作成します.vueの最後のファイル.このとき新しく作成されたvueは空白のファイルです.この空白ファイルにvue+tabを入力すると、カスタムvueテンプレートが自動的にロードされます.