日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學(xué)無(wú)先后,達(dá)者為師

網(wǎng)站首頁(yè) 編程語(yǔ)言 正文

vscode中配置代碼片段

作者:jieyucx 更新時(shí)間: 2023-07-26 編程語(yǔ)言

步驟如下:

  1. 設(shè)置->用戶(hù)代碼片段
    在這里插入圖片描述
  2. 新增全局代碼片段
    在這里插入圖片描述
  3. 起全局代碼片段文件名“xxx.code-snippets
    這里以配置vue2初始代碼片段為例
    在這里插入圖片描述
  4. 配置具體代碼片段
    按enter進(jìn)入文件配置,以下是vue2的代碼片段示例,具體可以自己隨意配置
{
	"Print to console": {
		"prefix": "vue2",
		"body": [
			"<template>",
			"  <div>",
			"",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  data() {",
			"    return {",
			"",
			"    }",
			"  },",
			"  created() {",
			"",
			"  },",
			"  mounted() {",
			"",
			"  },",
			"  methods: {",
			"",
			"  },",
			"}",
			"</script>",
			"<style scoped lang='scss'>",
			"",
			"</style>"
		],
		"description": "Log output to console"
	}
}
  1. 使用
    新建一個(gè)vue文件,開(kāi)始輸入vue,vscode會(huì)有提示的
    在這里插入圖片描述
    在這里插入圖片描述
    這就ok拉

下面在贈(zèng)送一波vue3的代碼片段吧

{
  "Print to console": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "  <div $1></div>",
      "</template>",
      "",
      "<script setup>",
      "import { ref, onMounted } from 'vue';",
      "import { useRoute, useRouter } from 'vue-router';",
      "const route = useRoute();",
      "const router = useRouter();",
      "onMounted(() => {",
      "  //console.log('3.-組件掛載到頁(yè)面之后執(zhí)行-------onMounted')",
      "})",
      "</script>",
      "<style scoped lang='scss'>",
      "</style>"
    ],
    "description": "Log output to console"
  }
}

原文鏈接:https://blog.csdn.net/jieyucx/article/details/131509194

  • 上一篇:沒(méi)有了
  • 下一篇:沒(méi)有了
欄目分類(lèi)
最近更新