VS Code 折騰記 - (15) 再來一波大前端適用系列的插件(主打編碼體驗改善)

前言

距離上次推薦又過去半年了.這期間我又蒐羅一些感受比較好用的插件;

有些體驗後被我幹掉,有些依舊保留.優秀的拓展插件產出真的有限,此次主推比較實用的小拓展

對於插件我不推薦重複的,有些優秀的插件在我另外幾篇文章可找到,其餘就很少說了.直入主題!

插件集

編碼體驗改善系列

• VS DocBlockr: Atom插件Docblockr移植版,很是好用的註釋插件
• Visual Studio IntelliCode - Preview : 提供AI支持(強化你的代碼智能提示),微軟出品
• File Utils : 很是實用的一個文件工具集,脫離鼠標,直接操做當前打開的頁面.
• npm-ui : 側邊欄添加npm圖標,npm菜單內能夠直接執行命令
• NPM Scripts : 命令行執行npm命令 ,能夠算是npm ui的非UI版本
• Surround : 快速包裹代碼而且添加對應的條件語句,很實用
• koroFileHeader : 快速添加註解到文件頭部(預約義模板),好比建立時間,誰建立的
• gi : 快速生成.gitignore
• tea-time : 番茄計時器!有助於改善你長期盯電腦的習慣,到點去喝杯水緩緩什麼的
• Visual Snake Code : 擼代碼累了.來一把貪吃蛇?而後繼續苦逼!
• javascript console utils : 快速生成console.log(選中)
• Turbo Console Log : 與上面那個相似,功能弱化些
• clear-console : 快速清除當前文件內的console.log信息,很實用
• Node JSON Autocomplete : 對於引入json文件提供智能提示

協做系列

• VS Live Share Whiteboard : Live Share 畫板支持,這下子不只代碼能協做,思路也能演示了

• VS Live Share : 代碼協做,會使用上面這個插件的小夥伴,確定也會用這個插件

Vue系列

• vusion peek : Vue組件快速跳轉(Peek)

React系列

• React PropTypes Generate : 一鍵生成react的proptypes , 不用ts的小夥伴必備
• React JavaScript to TypeScript Transformer for VSCode : React的js版本轉ts版本,有些瑕疵,但可用

文件支持系列

• docs-yaml : 提供yaml的智能補全和語法校驗功能
• DotENV : env文件的支持

小程序系列

• minapp : 寫原生微信小程序必備的插件,智能補全,函數跳轉等等

工具篇

• Error Gutters : 會把錯誤顯示爲圖標,相似git gutter ,一目瞭然
• carbon-now-sh : 快速生成漂亮的代碼圖片
• Bracket Pair Colorizer 2 : 原做者的第二版,括號高亮匹配更快速
• file-tree-generator : tree命令的鼠標操做版,還會輸出icon符號
• TypeScript Import Sorter : 適合強迫症用戶,給引入語句進行排序,能夠單文件或者整個目錄深度遍歷
• JSON Tree View : 可視化跳轉json,適合懶人快速定位json的某個key

主題篇**

• Light+ Tweaked : 柔和的亮色主題
• Palenight Theme : 很是好看的一個暗色主題
• Horizon Theme : 柔和的暗色調主題

文章撰寫

• PicGo : 很實用的圖牀上傳工具,直接返回url,用了都說好.
• MarkDown Link Suggestions : md內本地資源智能提示
• Markdown Command Assist:傻瓜化md使用,鼠標右鍵選擇生成

源碼學習協助

vscode-ast : 解析JS/TS文件生成AST樹在側邊欄

總結

有不對之處請留言,會及時修正,謝謝閱讀