当前位置: 首页 > 科技观察

15个好用的VSCode插件

时间:2023-03-20 15:38:14 科技观察

用好VSCode插件,不仅可以节省你的时间,还可以提高工作效率。VSCode有一个提供许多插件的市场。开发者可以给文本编辑器安装插件来增强编辑器的功能。在视图菜单中,选择扩展选项或按shift+cmd+X进入市场。善用VSCode插件,不仅可以节省时间,还可以提高工作效率,让你成为更好的开发者。1.LiveServer这个插件可以让我们在IDE中更改代码时自动重新加载网页。安装LiveServer后,右键单击html文件以查看使用LiveServer[Alt+L+Q]打开选项。下载地址:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer2。Quokka.jsQuokka.js会在你输入时自动计算结果,并在IDE中打印结果。下载地址:https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode3.CodeSpellChecker是一个拼写检查程序,可以为开发者报告一些常见的拼写错误。它适用于骆驼案例代码。下载地址:https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker4。GitLensGitLens增强了VisualStudioCode中内置的Git功能。它不仅可以帮助您通过Gitblame注释可视化代码作者,还可以无缝浏览和探索Git存储库,通过强大的比较命令获得有价值的见解等等。下载地址:https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens5。PrettierPrettier是一个严格的基于规则的代码格式化程序。它解析代码并使用自己的规则重新打印代码,从而实现一致的风格。这是一个重要的工具,它使我们无需开发人员的任何工作即可获得格式良好的代码。Prettier提供了合理的默认值,但您也可以在项目的根目录中提供一个配置文件来设置您自己的标准,例如行长度、制表符/空格的数量等。下载地址:https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode6。ESLintESLint是一种静态代码分析工具,用于识别JavaScript代码中有问题的模式。ESLint中的规则是可配置的,用户可以定义和加载自己的规则。它还涵盖代码质量和编码风格问题。下载地址:https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint7。vscode-icons插件会根据文件扩展名在树形视图中的文件名旁边添加一个图标,方便您识别文件。下载地址:https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons8。LiveSaasCompiler它可以帮助您实时将SASS/SCSS文件编译/翻译成CSS文件,并提供在线浏览器重新加载。下载地址:https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass9。JavaScript(ES6)代码片段此插件包含VSCode编辑器ES6语法的JavaScript代码片段(支持JavaScript和TypeScript)。下载地址:https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets10。浏览器预览它允许您打开一个真实的浏览器预览,以便在编辑器中进行调试。下载地址https://marketplace.visualstudio.com/items?itemName=auchenberg.vscode-browser-preview11。PathIntellisense这个扩展可以自动补全代码中的路径和文件名。下载地址:https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense12。BracketPairColorizer此扩展允许通过颜色识别匹配的括号。用户可以定义要匹配的字符和使用的颜色。下载地址:https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer13。VimVSCodeVim是用于VisualStudioCode的Vim模拟器,将Vim的强大功能带入您的文本编辑器。下载地址:https://marketplace.visualstudio.com/items?itemName=vscodevim.vim14。TODOHighlight高亮代码中的TODO、FIXME等注释。下载链接:https://marketplace.visualstudio.com/items?itemName=wayou.vscode-todo-highlight15。ColorHighlight此扩展程序对文件中的css/web颜色进行样式化,因此您无需打开页面即可查看它们是什么颜色。下载链接:https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight