使用vscode如何快速搭建vue模板?下面本篇文章給大家介紹一下vscode快速搭建vue模板的方法。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有所幫助。
相關推薦:《vscode》
vscode快速搭建vue模板
文件 -> 首選項 -> 用戶代碼片段
立即學習“前端免費學習筆記(深入)”;
搜索vue
vue2.x添加下方代碼
{ ?"Print?to?console":?{ ?"prefix":?"vue", ?"body":?[ ?"<!-- $0 -->", ?"<template>", ?"??<div></div>", ?"</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>", ?"??<div></div>", ?"</template>", ?"", ?"<script>", "import { computed, reactive, ref, watch, onMounted,onUpdate,onUnmounted} from 'vue';", "export default {", "setup(){", "//類mounted", "onMounted(()=>{", "", "})", "//相當于updated", "onUpdate(()=>{", "", "})", "//相當于destroyen", "onUnmounted(()=>{", "", "})", "return {}", "}", "}", "", "</script>", ?"<style>", "</style>" ?], ?"description":?"Log?output?to?console" ?} ?}
新建.vue文件后:
相關推薦:2020年前端vue面試題大匯總(附答案)vue教程推薦:2020最新的5個vue.JS視頻教程精選
更多編程相關知識,請訪問:vscode!!
? 版權聲明
文章版權歸作者所有,未經允許請勿轉載。
THE END