一個好用的開發工具對於開發來說很重要。經歷過HBuilder,sublime,webstorm之后,最終穩定使用 VSCode。
至於歷史,和與其他編輯器對比,在此不做解釋。僅從自己使用角度做個總結記錄。(總結是個好習慣)
VSCode之插件:詳細信息可搜索並打開相應插件查看
1、Auto Close Tag 自動閉合標簽

2、auto-rename-tag v0.1.1 自動重命名匹配的尾標簽

3、auto import v1.5.3 使用安裝包的組件方法時,自動發現並引入包
Automatically finds, parses and provides code actions and code completion for all available imports. Works with Typescript and TSX.
4、bracket-pair-colorizer v1.0.61 不同顏色高亮匹配的括號
5、code-runner v0.9.16 執行代碼片段和文件
Run code snippet or code file for multiple languages:
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, V, SCSS, Sass, and custom command
6、code-settings-sync v3.4.3 同步編輯器的配置,比如用戶配置,插件配置等。需要登錄GitHub
7、color-highlight v2.3.0 高亮顏色
8、compareit v0.0.2 對比文件
9、minapp-vscode v2.2.2
10、open-html-in-browser v2.1.2 在瀏覽器中打開HTML文件
11、prettier-vscode v3.20.0 格式化多種格式文件
JavaScript · TypeScript · Flow · JSX · JSON
CSS · SCSS · Less
HTML · Vue · Angular
GraphQL · Markdown · YAML
CSS · SCSS · Less
HTML · Vue · Angular
GraphQL · Markdown · YAML
12、prettify-json v0.0.3 格式化json
13、react-snippets v0.1.2 React 代碼片段
14、vscode-typescript-tslint-plugin v1.2.3 語法檢查

15、vetur v0.23.0
16、vscode-icons v10.0.0 圖標
17、wxml-vscode v0.1.2
18、vscode-browser-preview v0.5.9 在編輯器內打開一個瀏覽器環境
插件安裝好了,能幫助我們檢查一些不必要的錯誤,警告,提高編碼效率。而說到提高編碼效率,那么VSCode的快捷鍵不得不提。
常用的快捷鍵:
打開全局命令面板:CTRL + shift + P / F1
打開文件: CTRL + P
保存文件:CTRL + S
跳到下一處選中項:CTRL + D
打開/關閉終端:CTRL + `
打開/關閉側邊導航:CTRL + B
打開新編輯器窗體:CTRL + shift + N
打開新編輯器窗體:CTRL + shift + W
新建文件:CTRL + N
關閉文件:CTRL + W
刪除行:CTRL + shift + K
選中整行:CTRL + L
