[VueJsDev] 快速入门 - vscode 插件推荐
[VueJsDev] 目录列表
https://www.cnblogs.com/pengchenggang/p/17037320.html
Vscode 插件推荐
::: details 目录
- Vscode 插件推荐
- Font. 1: 字体推荐
- Them. 2: Ayu 主题
- Them. 3: Spacegray VSCode
- Plug. 4: Vetur vue2工具
- Plug. 5: volar vue3工具
- Plug. 6: Tabnine AI - 必备
- Plug. 7: Favorites 插件
- Plug. 8: 别名路径跳转 插件
- Plug. 9: Auto Close Tag
- Plug. 10: Auto Rename Tag
- Plug. 11: Beautify 插件
- Plug. 12: Prettier - Code formatter
- Plug. 13: Bracket Pair Color DLW
- Plug. 14: Chinese 插件
- Plug. 15: CSS Navigation
- Plug. 16:
Draw.io Integration - Plug. 17: EditorConfig for VS Code
- Plug. 18: Error Lens 插件
- Plug. 19: ESLint 插件
- Plug. 20: Git History 插件
- Plug. 21: npm 插件
- Plug. 22: Npm Intellisense
- Plug. 23: npm-links 插件
- Plug. 24: Path Intellisense
- Plug. 25: Paste Image 插件
- Plug. 26: Project Manager
- Plug. 27: Live Server
- Plug. 28: SFTP
- Plug. 29: Template String Converter
- Plug. 30: TypeScript Importer
- Plug. 31: Visual Studio IntelliCode
- Plug. 32: vue-helper 自动跳转
- Plug. 33: Dyno File Utils
:::
vscode 作为前端开发,需要搭建下开发环境,改的地方还是挺多的。
Font. 1: 字体推荐
开发环境 一个好字体,至关重要
Fira Code程序员字体 https://github.com/tonsky/FiraCode/releases/霞鹜文楷等宽 Light下载- Consolas 程序员字体 下载
- Courier New 是 Windows 的缺省等宽字体
// settings.json
"editor.fontFamily": "'Fira Code', '霞鹜文楷等宽 Light', Consolas, 'Courier New'",
Them. 2: Ayu 主题
主题相当重要,整个风格会一下子高大上起来
Ayu Mirage这是一款暗黑色的主题- 插件搜索
Ayu作者teabyii下载量 138万
// settings.json
"workbench.colorTheme": "Ayu Mirage",
Them. 3: Spacegray VSCode
之前用的一款主题
Base 16 Eighties这个风格我就特别喜欢
- 插件搜索
Spacegray VSCode作者Mihai Vilcu
Plug. 4: Vetur vue2工具
开发vue2的vscode官方插件
- 插件搜索
Vetur作者Pine Wu
Plug. 5: volar vue3工具
开发vue3的vscode官方插件
Vue Language Features (Volar)
- 插件搜索
Volar作者Vue - 还有一个ts的插件 具体看需要用哪个
Plug. 6: Tabnine AI - 必备
代码智能提示 用了就回不去了 关键是免费
- 插件搜索
Tabnine AI作者TabNine
Plug. 7: Favorites 插件
当前项目 收藏重要的页面
- 插件搜索
Favorites作者kdcro101下载量 3万 - 根目录会生成 .favorites.json 配置文件
Plug. 8: 别名路径跳转 插件
ctrl + 鼠标左键 点击 变量 函数名 自动跳转
- 插件搜索
别名路径跳转作者lihuiwang - 要有
jsconfig.json文件支持
Plug. 9: Auto Close Tag
自动闭合标签 插件
- 插件搜索
Auto Close Tag作者Jun Han
Plug. 10: Auto Rename Tag
标签自动改名 插件
- 插件搜索
Auto Rename Tag作者Jun Han
Plug. 11: Beautify 插件
代码格式化插件 这个插件用做vetur的html 格式化工具
- 插件搜索
Beautify作者HookQR - 这个插件不要启用全局 我记得会和eslint有冲突
Plug. 12: Prettier - Code formatter
代码格式化插件 这个插件用做vetur的css less 格式化工具
- 插件搜索
Prettier作者Prettier - 这个插件不要启用全局 我记得会和eslint有冲突
Plug. 13: Bracket Pair Color DLW
彩虹括号 插件
- 插件搜索
Bracket Pair Color DLW作者Bracket Pair Color DLW
Plug. 14: Chinese 插件
简体中文 全称是
Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code
- 插件搜索
Chinese作者Microsoft
Plug. 15: CSS Navigation
css 自动跳转
- 插件搜索
CSS Navigation作者pucelle
Plug. 16: Draw.io Integration
画图软件 必备
- 插件搜索
Draw.io作者Henning Dieterichs
Plug. 17: EditorConfig for VS Code
项目编码的基础设施
- 插件搜索
EditorConfig作者EditorConfig
Plug. 18: Error Lens 插件
错误信息直接显示在当前行的后面 特别直观
- 插件搜索
Error Lens作者Alexander
Plug. 19: ESLint 插件
代码校验插件 属于必备插件
- 插件搜索
ESLint作者Dirk Baeumer
Plug. 20: Git History 插件
git提交的历史记录 看看谁改出的bug
- 插件搜索
Git History作者Don Jayamanne
Plug. 21: npm 插件
执行 package.json 的 script 脚本,必装插件
- 插件搜索
npm作者egamma
Plug. 22: Npm Intellisense
导入导出 包名 的自动联想,必装插件
- 插件搜索
Npm Intellisense作者Christian Kohler
Plug. 23: npm-links 插件
显示依赖包的文件位置 主要看全局依赖包的位置,必装插件
- 插件搜索
npm-links作者Dolov
Plug. 24: Path Intellisense
路径的自动联想 必装插件
- 插件搜索
Path Intellisense作者Christian Kohler
Plug. 25: Paste Image 插件
截图后粘贴到vscode里面,这个不常用,因为
ObsidianTypora支持直接显示
- 插件搜索
Paste Image作者mushan
Plug. 26: Project Manager
将多个项目都显示在左侧列表 好切换,由于我用rolan,所以这个不太常用
- 插件搜索
Project Manager作者Alessandro Fragnani
Plug. 27: Live Server
在html文件右键 直接开服务 很方便
- 插件搜索
Live Server作者Ritwick Dey
Plug. 28: SFTP
自动将代码传送到ftp空间,自动脚本发布代码用的
- 插件搜索
SFTP作者liximomo
Plug. 29: Template String Converter
字符串里面输入变量 "Menu:" -> `Menu:${candy}`
- 插件搜索
Template String Converter作者meganrogge
Plug. 30: TypeScript Importer
ts开发使用 自动搜索ts定义 导入等等
- 插件搜索
TypeScript Importer作者pmneo
Plug. 31: Visual Studio IntelliCode
vscode 自动联想插件
- 插件搜索
Visual Studio IntelliCode作者Microsoft
Plug. 32: vue-helper 自动跳转
代码自动跳转
- 插件搜索
vue-helper作者shenjiaolong
Plug. 33: Dyno File Utils
2022年09月08日 星期四
Dyno File Utils - VSCode Extension 新建目录 新建文件 很好用
- 插件搜索
Dyno File Utils作者Dyno Nguyen - 这个插件找了1个多小时
[VueJsDev] 快速入门 - vscode 插件推荐的更多相关文章
- VScode 插件推荐与C/C++配置
以下是我经常用到的VScode插件.由于插件本身具有详细的配置和介绍,不对插件本身的安装配置进行说明,仅仅支出这些插件的主要功能.具体使用强烈推荐看一下安装插件后的说明,大多数的问题和设置都可以找到, ...
- react开发vscode插件推荐
原文地址:https://github.com/xieqingtian/blog/issues/2 由于本人主要是做react开发,用的代码编辑器是传说中的宇宙第一前端神器vscode, 所以在这里记 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-事实性回答应用从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-信息智能提取从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-智能编写Python注释文档字符串从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-复杂函数快速转单行函数从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-智能AI写作从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-快速创意生成从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-食谱智能生成从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
- 全网最详细中英文ChatGPT-GPT-4示例文档-人工智能助手从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
目录 Introduce 简介 setting 设置 Prompt 提示 Sample response 回复样本 API request 接口请求 python接口请求示例 node.js接口请求示 ...
随机推荐
- python处理Excel实现自动化办公教学(含实战)【二】
相关文章: python处理Excel实现自动化办公教学(含实战)[一] python处理Excel实现自动化办公教学(含实战)[二] python处理Excel实现自动化办公教学(数据筛选.公式操作 ...
- 8.5 CheckRemoteDebuggerPresent
CheckRemoteDebuggerPresent 也是一个微软提供的反调试函数,该函数可以在本地或者远程进程中使用.函数接收两个参数进程句柄和一个指向布尔值的指针.如果指定的进程正在被调试,则函数 ...
- idea 集成接口测试插件
idea api集成接口测试 日常逼逼叨 相信很多后端开发接口的小伙伴们在开发完成后也会进行简单的测试,可能会用到apifox,postman之类的测试工具,但是up近期发现了一个比较好用的idea插 ...
- Java 数字 默认是 Integer类型的问题,System.currentTimeMillis() + (180 * 24 * 60 * 60 * 1000)的问题,剖析、Long + Integer的问题
最终结论: (180 * 24 * 60 * 60) 这种计算表达式在 Java中是默认以 Integer类型来的,若不超过 Integer的最大值则没有问题,若超过则必须用 (180 * 24 * ...
- Python-pymysql如何向SQL语句中传参
方法一:不传递参数 ## 方式一.不传递参数 id = "01" name = "语文" sql = "select * from course wh ...
- JOISC 2022 记录
Day1 T1 Jail 操作很类似华容道.由于这题是可以树,同时每一个人走的都是最短路,这也就意味着不会出现通过好多个人一起的挪动来匀出空间. 所以如果合法,必然存在一种方案是每一次直接将一个人挪到 ...
- 从零开始的react入门教程(五),了解react中的表单,何为受控组件与非受控组件
壹 ❀ 引 我们在从零开始的react入门教程(四),了解常用的条件渲染.列表渲染与独一无二的key一文中介绍了react中常用的条件渲染操作,比如三元运算符,逻辑运算符等,结合react组件或者re ...
- NC16562 [NOIP2012]开车旅行
题目链接 题目 题目描述 小 A 和小 B 决定利用假期外出旅行,他们将想去的城市从 1 到 N 编号,且编号较小的城市在编号较大的城市的西边,已知各个城市的海拔高度互不相同,记城市 i 的海拔高度为 ...
- python中矩阵切片维数微秒变化
1 前言 使用切片访问矩阵的部分数据(特别是一行或一列数据)时,通常会出现切片维数怎么在瞎变化,以致于不得不用reshape()强制改变维数.在深度学习中,网络对矩阵维数的要求是非常严格的,往往就是这 ...
- display的值及作用
display的值及作用 display属性可以设置元素的内部和外部显示类型,元素的外部显示类型将决定该元素在流式布局中的表现,例如块级或内联元素,元素的内部显示类型可以控制其子元素的布局,例如gri ...