使用 vs code snippets 插件,提高开发效率✨✨

背景

平时在开发过程中,我们会大量使用到类似于:

javascript 复制代码
import TestComponent from '@/components'

or

import { formatTime } from '@/utils'

or

const fn = (name) => {
  console.log(name)
}

如何使用插件,提高这类重复的语法的编写呢?

使用 JavaScript (ES6) code snippets

安装 JavaScript (ES6) code snippets

场景1:import TestComponent from '@/components'

重点:

  1. 输入 imp
  2. 输入引入的模块名,如@/components/Test
  3. 按下 tab 键
  4. 输入 import 后的变量名,如 TestComponent

gif(左下角有我的按键显示):

场景2:import { formatTime } from '@/utils'

重点:

  1. 解构,类似于场景1
  2. 与场景1相同的操作不再赘述,通过tab输入解构出来的变量
  3. 额外的好处:先写 @/utils,再写 {} 里的变量,可以获得智能提示,如:

gif(左下角有我的按键显示):

场景3:定义函数

重点:

  1. 先输入函数名
  2. 按tab
  3. 输入参数
  4. 按tab
  5. 输入函数体

gif(左下角有我的按键显示):

总结

希望通过这篇文章,提高大家编写这些重复代码的效率,早点下班~~

相关推荐
爱勇宝29 分钟前
深扒 Anthropic 1680 位工程师简历:应届生几乎没机会,AI 公司最缺的不是博士
前端·后端·程序员
kyriewen1 小时前
同事每天催我 Code Review,我写了个脚本让 AI 替我 review PR——现在他反过来催 AI 了
前端·javascript·ai编程
user20585561518133 小时前
Windows 项目安装时报 `node-sass` 错误,如何快速处理
前端
LiaCode3 小时前
Redis 在生产项目的使用
前端·后端
LiaCode3 小时前
一天学完 redis 的爽翻版核心知识总结
前端·后端
大刚测试开发实战3 小时前
如何内网穿透访问本地私有化部署的TestHub
前端·后端·github
风骏时光牛马4 小时前
# Ruby基于Rails框架实现多角色权限管理与数据分页查询完整实战代码案例
前端
weedsfly4 小时前
迭代器、生成器与异步迭代——让数据“按需流动”的艺术
前端·javascript
xiaodaoluanzha4 小时前
迄今為止,最簡單的編程語言 Nolang
前端·后端
Csvn4 小时前
Fetch 请求竞态终结者:AbortController 不只是用来"取消"的
前端