大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE稳定放心使用
名称 | 功能 |
---|---|
Auto Rename Tag | 自动重命名配对的HTML / XML标签 |
Auto Close Tag | 自动添加HTML / XML结束标签 |
any rule | 常用正则表达式合集和工具 |
Browser Preview | 编辑器中嵌入浏览器可视化窗口 |
Bracket Pair Colorizer | 高亮匹配代码块括号 |
Better Comments | 文档注释 /** * 我的方法 * *重要的信息会被高亮显示 * !及其反对的代码,不要使用 * TODO 重构此方法 * @param 该方法的参数 */ |
Better Align | 根据符号(如冒号、等于号)对齐多行代码 使用方法:Ctrl+Shift+p输入“Align”确认即可 |
Code Runner | 非常强大的一款插件,能够运行多种语言的代码片段或代码文件:C,C ++,Java,JavaScript,PHP,Python,Perl,Ruby,Go等等,安装完成后,右上角会出现:▶ 解决输出乱码和支持输入问题:选择 文件->首选项->设置,打开VS Code设置 > Extensions,找到 Run Code configuration,勾上 Run In Terminal选项。设置之后代码就会在 Terminal 中运行了,无乱码及支持输入。 |
change-case | 修改文本的更多命名格式,包括驼峰命名、下划线分隔命名,snake_case 命名以及 CONST_CAS 命名等 使用方法:Ctrl+Shift+p输入“change”然后选择要修改的格式 |
Color Info | 颜色上悬停光标,就可以预览色块中色彩模型的(HEX、 RGB、HSL 和 CMYK)相关信息 |
Color Highlight | 在编辑器中高亮显示颜色值 |
Color Picker | 代码的颜色选择器 |
Csscomb | css 、less、sass 的代码格式化。 |
CSS Peek | 快速定位元素设置CSS文件及位置 在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek definition ”选项,它便会给你发送样式设置的 CSS 代码 |
Class autocomplete for HTML | 自动补全class=“” 属性 |
Codelf | 给变量起名的神器 |
css-auto-prefix | 给css加不同浏览器前缀 |
Debugger for Chrome | js调试的插件,前端项目在Chrome中运行起来之后,可以直接在VSCode中打断点、查看输出、查看控制台 |
Document This | 为js文件生成文档的代码注释。 |
Draw.io Integration | 画流程图 |
Data Preview | 预览数据文件 |
ESLint | 检查Javascript编程时的语法错误 |
EditorConfig for VS Code | 代码风格统一 |
filesize | 在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间 |
Format Files | 在侧栏文件夹右键,选择‘Start Format Files:This Folder’ 对文件夹所有的文件格式化 |
Git blame | 编辑器左下角展示最近一次的编辑信息 |
Git History | 以图表的形式查看 git 日志 |
GitLens | 查看每一行代码的提交日志 |
Guides | 代码的标签对齐线。 |
Highlight Matching Tag | 选中标签高亮标签对 |
HTML CSS Class Completion | 为基于工作空间上的CSS文件的HTML类属性提供CSS类名称提示。 |
HTML Boilerplate | 提供生成标准HTML样板代码。 |
HTML CSS support | css 自动补齐 |
HTMLHint | HTML 代码格式检测 |
HTML Snippets | 支持HTML5标签提示 |
htmltagwrap | 在选中HTML标签后按快捷键”Alt + W” 在外面套一层标签 |
Image Preview | 鼠标移到路径里显示图像预览 |
Indenticator | 突出目前的代码缩进深度 |
Indent-Rainbow | 给缩进添颜色,更加直观的看到代码层次 |
intelliSense for CSS class names in HTML | 把项目中 css 文件里的名称智能提示在 html 中 |
Import Cost | 您查看导入模块的大小 |
JavaScript (ES6) snippets | 支持JavaScript ES6 语法 |
JavaScript (ES6) code snippets | ES6语法提示 |
jQuery Code Snippets | jq代码段提示。 |
JS-CSS-HTML Formatter | 代码格式化。 |
koroFileHeader | 自动生成文档注释 |
Live Server | 实时简易服务器 |
Lodash | lodash 函数提示,输入下划线列出可用函数。 |
Lodash Snippets | lodash 函数提示,输入函数名列表默认第一个是lodash的函数。 |
Lorem ipsum | 快速填充文本 |
Log File Highlighter | 日志文件(.log后缀的文件)高亮 |
LeetCode | 刷算法题的插件 |
local history | 查看本地历史代码 |
markdownlint | markdown语法检测 |
Markdown Preview Enhanced | 编辑器内看markdown编译出来的效果 |
Markdown All in One | markdown编辑器 |
Material Icon Theme | 文件目录图标美化 |
MongoDB for VS Code | MongoDB 数据库支持 |
npm Intellisense | 在import语句中自动完成npm模块引入的代码插件。 |
Node.js Modules Intellisense | 可以在导入语句中自动完成JavaScript / TypeScript模块 |
Output Colorizer | 输出提示的文字颜色有一些变化,方便获取关键信息 |
open in browser | 在浏览器中打开,安装后在左侧目录中右键点击会出现 open in browser 选项。 |
Path Intellisense | 文件路径提示。 |
Prettier – Code formatter | 代码保存自动格式化 |
Partial Diff | 文件比较 |
Quokka.js | Quokka 是一个调试工具插件,能够根据你正在编写的代码提供实时反馈 使用方法: ctrl+shift+p 输入 quokka 选择 new javascript 就可以了 |
Polacode | 生成代码截图工具 打开文件在屏幕截图中选择想要的代码并复制它,转到 View> Command Palette,然后在框中输入> polacode 并选择 Polacode 选项。 它将创建一个单独的水平窗口。 点击窗口按 Ctrl + V 粘贴代码。 在代码下面,粘贴另一个窗口,会看到像图标这样的摄像头。 点击这个图标并保存图片。 |
px to rem | px转换rem工具 |
REST Client | 接口测试工具 |
Regex Previewer | 这是一个用于实时测试正则表达式的实用工具。它可以将正则表达式模式应用在任何打开的文件上,并高亮所有的匹配项。 快捷键Ctrl+Alt+M呼出右边的并排文本框,左边窗口输入的正则会实时匹配右边文本内容 |
Remote – SSH | 连接服务器管理文件 |
Settings Sync | 多设备同步Vue插件 |
Stylelint | CSS/SCSS/Less语法检测 |
Sort Lines | 选中多行文字排序 |
SVG Viewer | 此插件在 Visual Studio 代码中添加了许多实用的 SVG 程序,你无需离开编辑器,便可以打开 SVG 文件并查看它们。同时,它还包含了用于转换为 PNG 格式和生成数据 URI 模式的选项。在svg文件上右键菜单选择”SVG Viewer: View SVG” |
Surround | 在代码块中增加外包裹模板 |
TODO Highlight | 高亮todo注释 |
TODO Tree | todo树展示,快速定位到todo位置 |
Toggle Quotes | 切换双引号、单引号、反引号 |
Turbo Console Log | 快速添加 console.log 信息,js debug 必备 快捷键 ctrl + alt + l 选中变量之后,使用这个快捷键生成 console.log |
Vetur | Vue 语法高亮显示, 语法错误检查, 代码自动补全 |
VS Code CSS Comments | css代码注释。 |
VSCode Google Translate | 多语言开发时,切换语言包。 |
vscode-browser-plus | 在编辑器内预览HTML,通过开启端口(10086)监听当前打开项目的根目录,在编辑器内预览网站,省去了频繁切换浏览器、编辑器看页面效果,修改代码后自动刷新页面。 |
vscode-fileheader | 顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间 快捷键: Ctrl+Alt+i |
vscode-icons | 设置目录列表文件类型图标 |
vscode-spotify | 音乐播放控制器 |
Window Colors | 打开多个窗口时显示不同的颜色 |
wakatime | 编程时间及行为跟踪统计 |
React常用插件
名称 | 功能 |
---|---|
Reactjs code snippets | 代码提示 |
React-Native/React/Redux snippets for es6/es7 | 代码提示 |
Typescript React code snippets | tsx的react组件片段 |
CSS Modules | 对使用了css modules的jsx标签的类名补全和跳转到定义位置 |
参考资料:
https://www.cnblogs.com/zhn0823/p/6542335.html
https://blog.csdn.net/shenxianhui1995/article/details/81604818
https://github.com/varHarrie/varharrie.github.io/issues/10
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/188013.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...