系列文章目录
本系列文章主要分享作位前端开发的工具之------VScode的使用分享。
VScode | 我的常用插件分享_vscode 别名跳转-CSDN博客
VScode | 我会设置文件夹右键用VScode打开_vscode右键打开文件夹-CSDN博客
文章目录
目录
前言
今日分享我的常用代码片段,提升开发速度。也用于记录一下,后续换电脑配置直接CV。
打开vscode,点击文件>首选项>配置代码片段。新建全局代码片段文件…
版本
我用的window10系统。
vscode版本:
版本: 1.91.1 (user setup)
提交: f1e16e1e6214d7c44d078b1f0607b2388f29d729
日期: 2024-07-09T22:06:49.809Z
Electron: 29.4.0
ElectronBuildId: 9728852
Chromium: 122.0.6261.156
Node.js: 20.9.0
V8: 12.2.281.27-electron.0
OS: Windows_NT x64 10.0.19045
具体例子
一、vue2模版初始化
{
"vue2-template": {
"prefix": "vue2init",
"body": [
"<template>",
" <div class=\"$1\">",
"",
" </div>",
"</template>",
"",
"<script>",
"export default {",
" name: '$1',",
" data() { ",
" return {",
"",
" }",
" }",
" }",
"</script>",
"",
"<style lang=\"scss\" scoped>",
" .$1{",
"",
" }",
"</style>"
],
"description": "my vue2 template"
}
}
二、vue3模版初始化
{
"vue3-template": {
"prefix": "vue3init",
"body": [
"<template>",
" <div class='$1'></div>",
"</template>",
"",
"<script setup>",
"import { ref, onMounted } from 'vue';",
"import { useRoute, useRouter } from 'vue-router';",
"const route = useRoute();",
"const router = useRouter();",
"onMounted(() => {",
"",
"})",
"</script>",
"",
"<style scoped lang='scss'>",
" .$1{",
"",
" }",
"</style>"
],
"description": "my vue3 template"
}
}
三、请求接口的模版
{
"API init": {
"prefix": "const-api",
"body": [
"const { success, code, message, data } = await this.\\$esl.$1();",
"if (success) {",
"this.\\$message.success(this.\\$t('errorCode.' + code));",
"} else {",
"this.\\$message.error(message);",
"}",
],
"description": "const api"
}
}
四、快速log的模版
{
"Print to console": {
"prefix": "log",
"body": ["console.log('$1');", "$2"],
"description": "Log output to console"
},
}
五、快速写函数注释的模版
{
"function comment": {
"prefix": "funccomment",
"body": [
"/**",
" * $1",
" *",
" * @param $3 $4 $5",
" * @returns $9",
" */"
],
"description": "Add function comment"
},
}
最后
如果说
友友们之间的点赞
展现的是相互之间的支持,善意和友情
那么
你对我文章的认真阅读
则是对我的劳动成果的
默默地承认和支持
每一次创文的过程
都是我锻炼自己逻辑思维能力和语言组织能力的过程
也是我
不断深悟生活,思考人生的过程
每一篇文章的形成
都是我心血的结晶
感谢您的阅读
关注我,后续持续分享哦!~