好用的vscode插件
1.Chinese (Simplified) Language Pack for Visual Studio Code
作用:中文翻译vscode
2.Auto Close Tag
作用:自动闭合html标签
3.Auto Rename Tag
作用:自动同步重命名标签
4.carbon-now-sh
作用:分享好看的代码片段。一般我们将代码片段发送给别人的时候是直接复制代码或者直接截图,这款插件提供了更好看的代码片段。
使用:先选中要分享的代码片段,然后使用快捷键Alt+Cmd+A(Alt+Windows+A)
,此时会在浏览中自动打开要分享的代码片段,可以在网站中设置主题样式等等。
5.Code Runner
作用:运行代码片段
支持的语言:C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D, Lisp, Kit
注意:
- 对于Objective-C,仅在macOS上受支持
- 要运行C#脚本,您需要安装scriptcs
- 要运行TypeScript,您需要安装ts-node
- 要运行Clojure,您需要安装Leiningen和lein-exec
使用: 选中要执行的代码片段,鼠标右键选选择Run Code或者使用快捷键Control+Alt+N(Ctrl+Alt+N)
。也可以选择运行的语言,选中代码片段后按下快捷键Control+Alt+J(Ctrl+Alt+J)
然后选择
6.CSS Peek
作用: 通过css选择器快速跳至css文件(Cmd+鼠标单击/Ctrl+鼠标单击
);悬停css选择器预览css定义(Cmd+鼠标悬浮/Ctrl+鼠标悬浮
)
7.ESLint
作用:将ESLint集成到VS Code中
8.Git History
作用:查看Git历史记录
9.HTML Snippets
作用:HTML5标签提示、显色、说明中提到了标签是否已弃用
10.javascript console utils
作用:快速console.log和删除console.log
使用:选择要打印的变量,然后使用快捷键Cmd + Shift + L
会自动在下一行输出console.log('variable:',variable)
。使用快捷键Cmd + Shift + D
会删除当前文件中的所有console.log
11.LeetCode
作用:在 VS Code 中练习 LeetCode
使用:vscode-leetcode
12.npm Intellisense
作用:可自动完成导入语句中的npm模块
13.open in browser
作用:快速在浏览器中打开html文件
使用:在html文件中使用快捷键Alt+B
会在默认浏览器中打开当前html,如果要用非默认浏览器打开请使用快捷键Shift + Alt + B
,或者使用鼠标右键点击
14.Path Intellisense
作用:文件路径名提示
15.Simple React Snippets
作用:快速创建React代码片段。有很多这样的插件,不过我们一般只用创建一些常用的片段,所以我选择这款更小巧的插件
使用:在编辑器中输入imrc
然后按下tab
键会自动生成import React, { Component } from 'react';
输入cc
按下tab
键会自动生成
class extends Component {
state = { }
render() {
return ( );
}
}
export default ;
更多代码片段命令请查看Simple React Snippets官网
16.VSCode Great Icons
作用:好看的文件图标
使用:File→ PreferencesWindows
上或Code→ Preferences在OSX
,选择File Icon Theme
,然后选择VSCode Great Icons
16.Beautify
作用:美化javascript,JSON,CSS,Sass,和HTML
代码,使用快捷键Shift+Alt+F
17.Vetur
作用:vue必备插件之一。提供语法高亮、片段、整理/错误检查、代码提示等功能
20.Class autocomplete for HTML
作用:在html链接的css文件,可自动提示类名
21.Local History
作用: 本地文件修改历史
22.掘金
作用: 可以分屏看到掘金沸点,上班摸鱼利器
</div><div data-report-view="{"mod":"1585297308_001","dest":"https://blog.csdn.net/qq_37860930/article/details/102561403","extend1":"pc","ab":"new"}"><div></div></div>
<link href="https://csdnimg.cn/release/phoenix/mdeditor/markdown_views-60ecaf1f42.css" rel="stylesheet">
</div>