2025年5月18日大约 3 分钟
自定义代码片段
操作步骤
打开vscode>文件>首选项>用户代码片段>新建json文件
或者按ctrl +shift + p 输入 snippet 新建
存储路径
C:\Users\电脑用户名\AppData\Roaming\Code\User\snippets个人配置如下
提示
如下的代码片段基本不再使用,因为有其他更好的解决方案.放在这里是为了示例如何配置代码片段
php
- php头文件-这个是为了测试,同时为了创建php文件时快速省心
{
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
// "Print to console": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"php init": {
"scope": "",
"prefix": "pi",
"body": [
"<?php",
"$1"
],
"description": "php init"
}
}- php-laravel 这个是为了php的laravel项目快速初始化模型文件
{
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
"bm": {
"scope": "php",
"prefix": "bm",
"body": [
"public $$timestamps = false;",
"protected $$table = '$2';",
"protected $$guarded = ['$3'];",
"protected $$attributes =",
"[",
"];\r\n",
"public function setCreatedAtAttribute($$time)",
"{",
"\t$$this->attributes['created_at'] = date('Y-m-d H:i:s',$$time);",
"}\r\n",
"public function setUpdatededAtAttribute($$time)",
"{",
"\t$$this->attributes['updated_at'] = date('Y-m-d H:i:s',$$time);",
"}\r\n",
"public function setDeletedAtAttribute($$time)",
"{",
"\t$$this->attributes['deleted_at'] = date('Y-m-d H:i:s',$$time);",
"}\r\n",
],
"description": "laravle 模型创建完毕后基础设置"
}
}js和vue
- console
{
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
"Print to console": {
"scope": "javascript,typescript",
"prefix": "log",
"body": [
"console.log($1)",
],
"description": "Log output to console"
}
}- vue2
提示
这个目前在vue2中的项目仍在使用
{
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
// "Print to console": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"Print to console": {
"scope": "vue",
"prefix": "vt",
"body": [
"<template>",
"\t<div >",
"\t\t{{ msg }}",
"\t</div>",
"</template>",
"<script>",
"export default",
"{",
"\t//组件名称",
"\tname: 'Index',",
"\t//组件",
"\tcomponents:",
"\t{",
"\t},",
//父组件传值
"\tprops:",
"\t{",
"\t},",
"\t//计算属性",
"\tcomputed:",
"\t{",
"\t},",
"\t//监听",
"\twatch:",
"\t{",
"\t},",
"\t//数据",
"\tdata ()",
"\t{",
"\t\treturn {",
"\t\t\tmsg:'我是首页'",
"\t\t}",
"\t},",
"\t//实例创建之前",
"\tbeforeCreate()",
"\t{",
"\t},",
"\t//创建",
"\tcreated()",
"\t{",
"\t},",
"\t//挂载之前",
"\tbeforeMount()",
"\t{",
"\t},",
"\t//挂载 --常用",
"\tmounted()",
"\t{",
"\t},",
"\t//更新之前",
"\tbeforeUpdate()",
"\t{",
"\t},",
"\t//跟新后",
"\tupdated()",
"\t{",
"\t},",
"\t//销毁之前",
"\tbeforeDestroy()",
"\t{",
"\t},",
"\t//销毁后",
"\tdestroyed()",
"\t{",
"\t},",
"\t//方法",
"\tmethods:",
"\t{",
"\t},",
"}",
"</script>",
"<style lang='scss' scoped>",
"</style>",
],
"description": "create a vue template"
}
}