typescript语法高亮插件_vscode常用插件
插件介绍
- HTML Snippets
> 初级H5代码片段及提示
- HTML CSS Support
> 初级H5代码片段及提示
- Debugger for Chrome
> 让 vscode 映射 chrome 的 debug功能,静态页面都可以用 vscode 来打断点调试 - jQuery Code Snippets
> jquery 重度患者必须品,废话不多说 - vscode-icon
> 让 vscode 资源树目录加上图标,必备良品! - Path Intellisense
> 自动路劲补全,默认不带这个功能的,赶紧装 - beautify
> 格式化代码的工具 - Prettier
> 格式化代码的工具,一键美化你的JavaScript/TypeScript/CSS代码。 - Color Highlight
> 直观展示你定义的颜色。
- Atuo Rename Tag
> 修改 html 标签,自动帮你完成尾部闭合标签的同步修改 - GitLens
> 丰富的git日志插件 - fileheader
> 顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间
- Bracket Pair Colorizer
> 让括号拥有独立的颜色,易于区分。可以配合任意主题使用。代码块高亮.
- Open-In-Browser
> 此插件在快捷菜单中添加了在默认浏览器查看文件选项,以及在客户端(Firefox,Chrome,IE)中打开命令面板选项
- Quokka
> Quokka 是一个调试工具插件,能够根据你正在编写的代码提供实时反馈。它易于配置,并能够预览变量的函数和计算值结果。另外,在使用 JSX 或 TypeScript 项目中,它能够开箱即用。
``` // ctrl + shift + p 搜索 quokka 命令 执行
// 要打开新的quokka文件(Cmd/Ctrl + K, J对于JavaScript或Cmd/Ctrl + K, TTypeScript),请在现有文件(Cmd/Ctrl + K, Q)上(重新)启动它。 ```
使用:先shift+cmd+p (ctrl+shift+p)输入 quokka 选择 new javascript 就行了 - CSS Peek
> 你可以追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek definition ”选项,它便会给你发送样式设置的 CSS 代码。 - SVG Viewer
> 此插件在 Visual Studio 代码中添加了许多实用的 SVG 程序,你无需离开编辑器,便可以打开 SVG 文件并查看它们。同时,它还包含了用于转换为 PNG 格式和生成数据 URI 模式的选项。 - TODO Highlight
> 这个插件能够在你的代码中标记出所有的 TODO 注释,以便更容易追踪任何未完成的业务。在默认的情况下,它会查找 TODO 和 FIXME 关键字。当然,你也可以添加自定义表达式。// 在命令窗 搜索todo使用命令
1. background
背景图片可自定义//"background.enabled": false,//卸载插件开启 "background.useDefault": false, "background.style": { "content": "''", "pointer-events": "none", "position": "absolute", "z-index": "99999", "width": "100%", "height": "100%", "background-position": "0% 0%", "background-size": "cover", "background-repeat": "no-repeat", "opacity": 0.1 }, "background.customImages": [ "file:///F:/BaiduNetdiskDownload/s.jpg", "https://s.cn.bing.net/th?id=OSA.uMbS0SjznPW79w&w=230&h=160&c=8&rs=1&pid=SatAns" ],
1. Indenticator
高亮缩进线 - Auto Close Tag
> 自动添加HTML / XML关闭标签(必备) - Git History
> 以图表的形式查看git日志 - htmltagwrap
> 可以在选中HTML标签中外面套一层标签
使用:选择一大段代码,然后按“Alt + W” - Image Preview
> 鼠标移到路径里显示图像预览 - Output Colorizer
> 输出提示的文字颜色有一些变化,方便获取关键信息 - Sass
> sass必备 - Image Preview
> 鼠标移到路径里显示图像预览 - Image Preview
> 鼠标移到路径里显示图像预览 - Live Sass Compiler
> 实时编译 sass ,不过需要配置,附上我的配置"liveSassCompile.settings.formats":[ // You can add more { "format": "compressed",//压缩 "extensionName": ".min.css",//编译后缀名 "savePath": "./css"//编译保存的路径 } ],
- indent-rainbow
> 简单的插件可以使得对齐更加具有可读性。色彩填充断行,实用.
- Better Comments
> 更加人性化的注释
- Highlight Matching Tag
> 自动匹配标签结束地方
- vscode-spotify
> 音乐插件 - VueHelper
> snippet代码片段
Vue插件及react
- vetur
> 语法高亮、智能感知、Emmet等 - VueHelper
> snippet代码片段 - Import Cost > 引入包大小计算,对于项目打包后体积掌握很有帮助
- Vue 2 Snippets
> Vue2 片段补全工具 - npm Intellisense > 可以在导入语句自动补全npm模块名称。
- react-beautify > 格式化 javascript, JSX, typescript, TSX 文件
- React-Native/React/Redux snippets for es6/es7 > react代码片段,下载人数超多
主题及个性化
- Dracula Official > 目前我觉得是vscode上最漂亮的主题,
- One Dark Pro
> 最常用主题 - Eva Theme
> 里面包含黑色和白色主题,这个白色主题感觉挺好看的
- Boxy Theme Kit
> 最常用主题 - One Monokai Theme
- Material Theme
> Visual Studio Code最悠久的主题!
基本配置
- vacode配置及插件推荐
{"editor.tabSize": 2,"files.associations": {"*.vue": "vue"},"eslint.autoFixOnSave": true,"eslint.options": {"extensions": [".js",".vue"]},"eslint.validate": ["javascript","javascriptreact","vue","vue-html"],"search.exclude": {"**/node_modules": true,"**/bower_components": true,"**/dist": true},"emmet.syntaxProfiles": {"javascript": "jsx","vue": "html","vue-html": "html"},"extensions.autoUpdate": true,"editor.renderWhitespace": "boundary","editor.cursorBlinking": "smooth","workbench.welcome.enabled": true
}
typescript语法高亮插件_vscode常用插件相关推荐
- vscode怎么禁用插件_VSCode常用插件用户设置常见冲突解决
VSCode简介. Visual Studio Code是一个轻量级,跨平台,功能强大的源代码编辑器,能兼容市面上所有的编程语言. 相关链接:https://code.visualstudio.com ...
- typescript语法高亮插件_JavaScript开发者必备的10个Sublime Text插件
Sublime Text几乎是任何开发者在其工具箱的必备应用程序.Sublime Text是一款跨平台的,高度可定制的,高级的文本编辑器,既适合全功能的IDE(出了名的资源匮乏),又可匹配命令行编辑器 ...
- Vscode下载安装使用教程_Vscode搭建Python开发环境_Vscode常用插件
文章目录 1 下载 2 安装 3 搭建Python安装环境 4 推荐几款好用的插件 1 下载 官网 https://code.visualstudio.com/ 直接下载可能会很慢,所以我们用国内的镜 ...
- 如何通过离线安装的方式让sublime text具有TypeScript语法高亮的功能
我机器上安装的sublime text 2打开后缀为ts的TypeScript文件,默认以纯文本的格式打开,不具备语法高亮: 从这个Github仓库下载TypeScript的语法高亮插件: https ...
- vim 安装插件及常用插件
vim 插件管家 vim 支持很多插件,为了方便统一管理,通常会先安装插件管家,然后通过这个插件实现自动安装.卸载.更新插件.vim 常用的插件管家有 vundle 和 vim-plug,这里以 vu ...
- javascript功能插件大集合 前端常用插件 js常用插件
包管理器 管理着 JavaScript 库,并提供读取和打包它们的工具. npm:npm 是 JavaScript 的包管理器.官网 Bower:一个 web 应用的包管理器.官网 component ...
- webstorm 添加php插件,webstorm常用插件分享
首先依次点击File -> settings -> Plugins 调出设置中的插件选项,或者直接快捷键 ctrl + alt + s也可调出设置菜单. 常用插件如下: 1.ideaVim ...
- Linux中zsh插件,Zsh 常用插件
zsh有了各种插件后才真是如虎添翼,各种命令高亮,自动补全,命令参数辅助等. zsh插件安装方法 各种插件的安装方法各异,有的直接将插件文件夹拷贝到~/.oh-my-zsh/custom/plugin ...
- lottie插件_RN常用插件集
前言:从事RN开发快一年了,开发过程中遇到许多坑,连滚带爬的都趟过来了,简单总结下常用的RN插件,方便以后查阅. 建议:能自己写的插件就自己写吧,别偷懒,(虽然可能没有别人的好,起码也是自己造的儿子, ...
最新文章
- 牛逼!Python常用数据类型的基本操作(长文系列第一篇)
- Redis的安装与部署
- 如何修改Fiori Launchpad里Tile count 调用的时间间隔
- hadoop-hdfs-存储模型-架构模型-角色介绍
- python基础学习20----线程
- 解决 clipboard.js 在ios中失效的问题
- 二叉树后序遍历_二叉树后序遍历非递归实现
- 用年轻人的压力赚钱,解压馆是门好生意吗?
- java sybase存储过程_sybase存储过程-----不定时更新
- spring Assert
- MySQL视图,触发器,事务,存储过程,函数
- 图片压缩大小的3种方法,简单快捷实用!
- 了解云的一些基本概念
- 「Python入门」Python代码规范(风格)
- 华为eNSP模拟器软件介绍和基础命令详解
- transformers的近期工作成果综述
- 利用word和excel实现中英文互换
- 服务器ocs系统,ocs的部署与应用(一)
- 求解1000以内的质数
- 机器学习基础知识总结
热门文章
- python基础入门(8)之集合
- axure8.0发布html,Axure 8.0 beta最后一批新增和改进功能的介绍
- python查询最高分_精通 Oracle+Python,第 1 部分:查询最佳应践
- 动画制作c语言程序,C语言动画制作
- php 预防循环发短信_php短信接口发送短信失败,罪魁祸首原来在这里
- 解决cv2.error: OpenCV(4.0.0)的方法
- Pytest标记用例失败之xfail
- 【Python爬虫】requests与urllib库的区别
- 商城左侧菜单栏网页模板
- 曼哈顿距离最小生成树与莫队算法(总结)