前端開發利器VSCode


最近找到一款非常好用的開發利器,VSCode。一直認為微軟做的東西都很一般,這個軟件讓我刮目相看了。

之前使用webstorm卡的不行,換了這個非常好用。

用着還不錯,這里記錄下一些使用的心得。

VS Code的官網:

https://code.visualstudio.com/

VS Code的官方基礎教程:

https://code.visualstudio.com/docs

 

常用快捷鍵

Ctrl + /:快速注釋或取消注釋;

Ctrl + o:打開當前文件所在目錄;

Ctrl + p:打開跳轉到某文件的窗口;

 

文件過濾

VS Code默認會顯示所有的文件,但是其中某些文件其實是無法查看的,比如.o文件。

對於這些文件最好是過濾掉,不要顯示在側邊欄中。

為此可以打開文件->首選項->設置,之后在編輯框中會跳出來默認設置文件和setting.json文件。

默認設置文件不可修改,我們需要在setting.json文件上對默認設置進行覆蓋,如下所示:

 

最右邊的就是setting文件,增加的代碼如下:

 

  1. // 將設置放入此文件中以覆蓋默認設置  
  2. {  
  3.     // 配置 usr 模式以排除文件和文件夾。  
  4.     "files.exclude": {  
  5.         "**/.git": true,  
  6.         "**/.svn": true,  
  7.         "**/.hg": true,  
  8.         "**/.DS_Store": true,  
  9.         "**/*.o": true,  
  10.         "**/*.o.cmd": true  
  11.     }  
  12. }  

files.exclude就是過濾文件設置,這里的前4條是默認的,后面兩條是新增的。

  1. "**/*.o": true,  
  2. "**/*.o.cmd": true  

表示的是忽略所有以.o和.o.cmd結尾的文件。這樣在VS Code中就不在會顯示這些文件。

這里也可以控制不顯示文件夾,比如

 

  1. "**/Build": true  

這里就隱藏了Build這個文件夾。

 

setting.json中當然還可以進行各種的設置,可以參看左側的默認設置,進行自定義的修改。

使用VS Code進行Python調試

1)首先需要下載Python的插件:

點擊紅框中的部分,可以選擇不同的插件,這里已經是安裝了Python插件之后的結果。

2)之后選擇“文件->ngs.json中修改成本機的python位置:

3)打開Python文件所在的文件夾,就可以進行調試了:

 

需要注意光打開文件是沒有用的,必須要打開文件所在的目錄才行。

VS Code還會在該目錄下創建一個.vscode目錄,其中包含可配置文件launch.json。

 

自定義代碼片段

選擇"文件->首選項->用戶代碼片段",會跳出來如下的窗口:

根據需要選擇其中的以下,比如這里想要創建一個注釋片段,可以選在純文本。

在打開的plaintext.json中添加自定義的代碼片段,下面是一個例子:

藍字部分的解釋:

Comment:自定義的名字,隨便取,表明這個代碼片段的意義即可;

prefix:快捷字段,在后續的代碼編輯時輸入對應的值,比如這里的ct,就會提示使用這個代碼片段;

body:代碼片段的實際內容;

description:輸入prefix值之后彈出的提示中的注釋。

下面是實際使用的效果:

點擊回車后:

 

其它

VS Code可以切換換行符,一般Windows和Unix類系統使用的換行符又差異,而VS Code兩者都支持且可以任意切換。

如上述右下角的紅框所示,這里顯示了當前的換行符,左鍵點擊這里就可以進行設置。

使用它來做React項目開發完全不卡。

推薦大家使用這款軟件。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM