在vscode中创建代码片段的方法:
file -> preferences -> user snippets -> New global snippets file...,来创建一个全局代码片段。其实就是一个json文件,用来快速创建代码的。
里面一些配置,注释也讲得比较清楚:
- prefix:插入代码片段的快捷键
- scope:用来指定代码片段在哪些文件类型里生效,如不指定,则默认所有文件类型中都生效
- body: 要创建的代码片段内容
- description:对于代码片段的描述
- $n:表示光标的位置(n从1开始),使用tab可以切换下一处光标
vue代码片段
// vue.code-snippets
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div>",
"",
" </div>",
"</template>",
"",
"<script>",
"export default {",
" name: '',",
" components:{},",
" data() {",
" return {",
"",
" }",
" },",
" created() {",
" },",
" mounted() {",
" },",
" methods: {",
"",
" }",
"}",
"",
"</script>",
"",
"<style scoped>",
"",
"</style>"
],
"description": "Log output to console"
}
}
方法注释
// vfunction.code-snippets
{
"function comment line": {
"scope": "javascript,typescript",
"prefix": "vfunc",
"body": [
"/**",
" * @description description...",
" * @param $1:",
" * @return $2:",
" */",
"$0"
],
"description": "添加方法注释"
}
}
日志打印
// log.code-snippets
{
"Print to console": {
"scope": "javascript,typescript",
"prefix": "log",
"body": [
"console.log('$1:', $2);",
],
"description": "Log output to console"
}
}