VSCode中提高開發效率的超實用外掛（分享）

本篇文章推薦給大家一些極大提升國人開發效率超實用的VSCode外掛程式。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有幫助。

我相信好多英文不好的同學在打程式碼的時候，常常會遇到不懂的單字，也相信好多時候同學寫專案時候忘記框架的接口，需要網上翻閱文檔，線上提問求助，參考其他項目的示例，那麼如果你都過遇到這類問題，那麼相信這款VS Code  插件能極大的幫助到你，它能讓您在代碼中進行線上/線下搜索，或翻譯的。

【推薦學習：《vscode教學》】

#使用

介紹下簡單的使用過程，你可以在VS Code 中搜尋Search/Translate Hero 然後點擊安裝，你也可以在這裡進行下載：

• https://marketplace.visualstudio.com/items?itemName=Wscats .search
  

如果你使用的是國產Hbuider 編輯器，你可以點擊這裡進行下載：

• https ://ext.dcloud.net.cn/plugin?id=3557

#搜尋

首先，第一個最重要的功能就是搜索，身為開發者，我們每天打程式碼肯定都離不開搜索，當你在寫程式碼的過程中遇到不明白的函式庫，例如：require('react')，你就可以在編輯器中，選取程式碼中對應的關鍵字react，然後點選滑鼠右鍵，在出現的選單面板中選擇Search Online 選單項，外掛程式會自動幫你開啟預設瀏覽器，並蒐索對應的關鍵字和顯示搜尋結果。

當然你還可以選取對應的關鍵字後，使用快捷鍵cmd enter(mac) / ctrl enter(win) 去開啟瀏覽器進行搜索，這樣會更有效率，再也無需每次切換螢幕到瀏覽器，輸入搜尋網址鍵入關鍵字然後進行搜尋囉。

翻譯

英文不好的同學的福音，當你在程式碼中遇到不懂的單詞，你可以在編輯器中，選取程式碼中對應的關鍵字，然後點擊滑鼠右鍵，在出現的選單面板中選擇Traslate Online 選單項，外掛程式會自動幫你開啟預設瀏覽器，並進入Google翻譯搜索，搜尋對應的關鍵字的翻譯結果。

同樣你還可以選取對應的關鍵字後，使用快速鍵 cmd shift enter(mac) / ctrl shift enter(win) 去開啟瀏覽器進行翻譯。

這裡也使用了離線英漢字典外掛程式中提供的離線字典庫，所以支援了離線字典的搜索，也是跟上面一樣相同的操作，選取程式碼中的關鍵字，翻譯結果會出現在底部欄右下角，簡單的翻譯無需頻繁地諮詢百度和谷歌翻譯，在底部展示結果，方便也清晰，如果你想查看更詳細的翻譯結果，可以點選底部欄右下角的中文翻譯結果，此時會打開你的預設瀏覽器進行線上翻譯。

切換搜尋引擎

如果你有其他特別需要，你可以切換不同的搜尋引擎，只需要點擊在編輯器底部欄右側Search Engine，然後在彈窗選項中選擇你需要的搜尋引擎即可切換。

你也可以在右鍵選單列中選擇 Search Online By Switch Engine選單項，直接切換對應的搜尋引擎進行搜尋。

如果預設的搜尋引擎位址不能滿足你的使用，你可以手動更新搜尋引擎位址，進入外掛程式的Extesion Settings 裡設定即可。

預設的各搜尋引擎位址格式如下：

#注意：使用%SELECTION% 來取代搜尋引擎選中的關鍵字

BingGithub#Baiduwww.npmjs.com/search?q=%S…search.yahoo.com/search?p =%S…wikipedia.org/wiki/%SELEC…##Code Pen

Engine	Url
Google
#www.google.com/search?q=%S…
www.bing.com/search?q=% S…
www.github.com/search?q=%S…
www.baidu.com/search?q=%S…	##Npm
	#Yahoo
	Wiki
	##wikipedia.org/wiki/%SELEC…
Duck	duckduckgo.com/?q=%SELECTI…

codepen .io/search/pens…

Code Sandboxcodesandbox.io/search?quer…

例如，你可以鍵入一個

顏色網站

的搜尋引擎，以後打著打著程式碼就可以隨時進入一波賢者模式了(手動滑稽)。

哼，你也可以透過修改.vscode/setting.json 文件，來設定預設搜尋引擎，例如修改

search-online.search-engine### 的配置參數為###Bing###，即可使用###Bing### 作為預設搜尋引擎來搜尋。 ###

{
  "search-online.search-engine": "Bing"
}

###透過更改 ###.vscode/setting.json### 檔案的 ###search-online.add-search-engine### 的設定參數，可以新增額外的搜尋引擎。 ###

{
  "search-online.add-search-engine": [
    {
      "name": "Visual Studio Marketplace",
      "url": "https://marketplace.visualstudio.com/search?term=%SELECTION%&target=VSCode"
    },
    {
      "name": "Pypi",
      "url": "https://pypi.org/search/?q=%SELECTION%"
    }
  ]
}

###如果你嫌上面的操作都很麻煩，那你還可以透過視覺化介面來增加搜尋引擎，在切換引擎的面板底部點擊###➕ Add Search Engine###，然後會出現兩次輸入框，分別填入以下內容，即可增加搜尋引擎↓#########name: Visual Studio Marketplace############url： https:// marketplace.visualstudio.com/search?term=%SELECTION%&target=VSCode##################有了這些，你可以一鍵在Github 上搜尋相關程式碼，在Npm 搜尋相關的工具庫，在Wiki 檢索專業得詞條，在Duck Duck Go 留下你不可告人的小秘密，在Code Pen 粘貼幾段小代碼回來，總之就是不講道理，毫無武德。 #########切換翻譯引擎#########一般情況，你可以在設定面板上改變需要翻譯的語言，預設設定是英文翻譯成中文。 ###############但如果遇到二般情況，例如遇上俄國人寫的程式碼和註釋，你想翻譯一下，那麼你可以把翻譯引擎切換到俄文翻譯成中文的設置，這裡支持世界上大部分語言的線上翻譯，谷歌翻譯是個好東西，後續會增加百度翻譯引擎的支持，請大家多多資瓷啦~######更多編程相關知識，請造訪：###程式設計教學###！ ！ ###

以上是VSCode中提高開發效率的超實用外掛（分享）的詳細內容。更多資訊請關注PHP中文網其他相關文章！