vscode中快速搭建vue模板的方法介紹

vscode如何快速搭建vue模板?下面本篇文章給大家介紹一下。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有所幫助。

vscode中快速搭建vue模板的方法介紹

相關推薦:《vscode基礎教程》、《vue.js教程》

文件 -> 首選項 -> 用戶代碼片段
搜索vue

vue2.x添加下方代碼

{  ?"Print?to?console":?{  ?"prefix":?"vue",  ?"body":?[  ?"<!-- $0 -->",  ?"<template>",  ?"??<p></p> <p><span>立即學習</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免費學習筆記(深入)</a>”;</p>",  ?"</template>",  ?"",  ?"<script>",   "export default {",   "  data () {",   "    return {",   "    };",   "  },",   "",   "  components: {},",   "",   "  computed: {},",   "",   "  mounted: {},",   "",   "  methods: {}",   "}",   "",   "</script>",  ?"<style>",   "</style>"  ?],  ?"description":?"Log?output?to?console"  ?}  ?}

vue3.x添加下方代碼

{ "Print?to?console":?{  ?"prefix":?"vue3",  ?"body":?[  ?"<!-- $0 -->",  ?"<template>",  ?"??<p></p> <p><span>立即學習</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免費學習筆記(深入)</a>”;</p>",  ?"</template>",  ?"",  ?"<script>",   "import { computed, reactive, ref, watch, onMounted,onUpdate,onUnmounted} from &#39;vue&#39;;",   "export default {",   "setup(){",   "//類mounted",   "onMounted(()=>{",   "",   "})",   "//相當于updated",   "onUpdate(()=>{",   "",   "})",   "//相當于destroyen",   "onUnmounted(()=>{",   "",   "})",   "return {}",   "}",   "}",   "",   "</script>",  ?"<style>",   "</style>"  ?],  ?"description":?"Log?output?to?console"  ?} ?}

新建.vue文件后 ??

vscode中快速搭建vue模板的方法介紹

相關推薦:

2020年前端vue面試題大匯總(附答案)

2020年前端vue面試題大匯總(附答案)

更多編程相關知識,請訪問:2020年前端vue面試題大匯總(附答案)!!

以上就是

? 版權聲明
THE END
喜歡就支持一下吧
點贊13 分享