vscode加快开发速度的常用代码片段

在user snippets中的vue.json中配置常用的代码片段(持续更新中)

javascript 复制代码
{
  "Print to console": {
    "prefix": "log",
    "body": ["console.log('$1');", "$2"],
    "description": "Log output to console"
  },
  "vue3 component": {
    "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.-组件挂载到页面之后执行-------onMounted')",
      "})",
      "</script>",
      "<style scoped lang='scss'>",
      "</style>"
    ],
    "description": "vue3的代码片段"
  },
  "function comment": {
    "prefix": "funccomment",
    "body": [
      "/**",
      " * $1",
      " * $2",
      " *",
      " * @param  $3  $4  $5",
      " * @param  $6  $7  $8",
      " * @returns $9",
      " */"
    ],
    "description": "Add function comment"
  },
  "page comment": {
    "prefix": "pagecomment",
    "body": [
		"<!--",
		"  Author: Your Name",
		"  Last Modified: 2023-11-06",
		"  Description: Vue Component",
		"-->",
    ],
    "description": "Add function comment"
  },
  "vue2 component": {
	"prefix": "vue2",
	"body": [
	  "<template>",
	  "  <div>",
	  "    $1",
	  "  </div>",
	  "</template>",
	  "",
	  "<script>",
	  "export default {",
	  "  data() {",
	  "    return {",
	  "      $2",
	  "    }",
	  "  },",
	  "  methods: {",
	  "    $3",
	  "  }",
	  "}",
	  "</script>",
	  "",
	  "<style scoped>",
	  "  $4",
	  "</style>"
	]
  },
  "JavaScript If Statement": {
	"prefix": "if",
	"body": [
	  "if ($1) {",
	  "  $2",
	  "}"
	],
	"description": "JavaScript If Statement"
  }
  
}
相关推荐
Codiggerworld11 小时前
Vim 实战:在 VS Code、JetBrains、终端里玩转 Vim
编辑器·vim·excel
AD钙奶-lalala12 小时前
Android Studio新建项目默认不使用Compose模版
android·ide·android studio
专注VB编程开发20年17 小时前
开发VS2026插件最佳方案:老式VSIX EnvDTE
ide·c#·visual studio
专注VB编程开发20年17 小时前
VS2026最新ide插件VisualStudio.Extensibility进程外 OOP 新模型
ide·c#·visual studio
互联网散修18 小时前
鸿蒙实战:图片编辑器——文字功能完全实现
华为·编辑器·harmonyos·图片编辑添加文字
在水一缸18 小时前
深度解析:基于 3D Gaussian Splatting 技术的编辑器实践与原理
计算机视觉·3d·编辑器·aigc·3d建模·nerf·3d编辑器
稷下元歌19 小时前
7天学会plc加机器视觉关于运动控制部份,配套视频在bib
开发语言·c++·git·vscode·python·docker·pip
专注VB编程开发20年19 小时前
VisualStudio.Extensibility跨进程插件是防卡死IDE?
ide·visual studio
wenzhangli71 天前
AI-IDE 关键技术解析:从自然语言到企业级智能开发平台的架构演进
ide·人工智能·架构
${王小剑}1 天前
在pycharm中配置pyside6
ide·python·pycharm