極大提升國人開發效率超實用的 VS Code 插件

image
相信好多英語很差的同窗在打代碼的時候,常常會遇到不懂的單詞,也相信好多時候同窗寫項目時候忘記框架的接口,須要網上翻閱文檔,線上提問求助,參考其餘項目的示例,那麼若是你都過遇到這類問題,那麼相信這款 VS Code 插件能極大的幫助到你,它能讓您在代碼中進行線上/線下搜索,或者翻譯的。react

使用

介紹下簡單的使用過程,你能夠在 VS Code 中搜索 Search/Translate Hero 而後點擊安裝,你也能夠在這裏進行下載:git

image

若是你使用的是國產 Hbuider 編輯器,你能夠點擊這裏進行下載:github

搜索

首先,第一個最重要的功能就是搜索,做爲開發者,咱們天天打代碼確定都離不開搜索,當你在寫代碼的過程當中遇到不明白的庫,好比:require('react'),你就能夠在編輯器中,選中代碼中對應的關鍵詞 react,而後點擊鼠標右鍵,在出現的菜單面板中選擇 Search Online 菜單項,插件會自動幫你打開默認瀏覽器,並搜索對應的關鍵詞和顯示搜索結果。npm

固然你還能夠選中對應的關鍵詞後,使用快捷鍵 cmd+enter(mac) / ctrl+enter(win) 去打開瀏覽器進行搜索,這樣會更高效,再也無需每次切換屏幕到瀏覽器,輸入搜索網址鍵入關鍵詞而後進行搜索啦。json

image

翻譯

英文很差的同窗的福音,當你在代碼中遇到不懂的單詞,你能夠在編輯器中,選中代碼中對應的關鍵詞,而後點擊鼠標右鍵,在出現的菜單面板中選擇 Traslate Online 菜單項,插件會自動幫你打開默認瀏覽器,並進入谷歌翻譯搜索,搜索對應的關鍵詞的翻譯結果。瀏覽器

一樣你還能夠選中對應的關鍵詞後,使用快捷鍵 cmd+shift+enter(mac) / ctrl+shift+enter(win) 去打開瀏覽器進行翻譯。框架

image

這裏還使用了離線英漢詞典插件中提供的離線詞典庫,因此支持了離線詞典的搜索,也是跟上面同樣相同的操做,選中代碼中的關鍵詞,翻譯結果會出如今底部欄右下角,簡單的翻譯無需頻繁地諮詢百度和谷歌翻譯,在底部展現結果,方便也清晰,若是你想查看更詳細的翻譯結果,能夠點擊底部欄右下角的中文翻譯結果,此時會打開你的默認瀏覽器進行線上翻譯。編輯器

image

切換搜索引擎

若是你有其餘特別須要,你能夠切換不一樣的搜索引擎,只須要點擊在編輯器底部欄右側 Search Engine,而後在彈窗選項中選擇你須要的搜索引擎便可切換。ide

image

你還能夠在右鍵菜單欄中選擇 Search Online By Switch Engine菜單項,直接切換對應的搜索引擎進行搜索。工具

image

若是預設的搜索引擎地址不能知足你的使用,你能夠手動更新搜索引擎地址,進入插件的 Extesion Settings 裏設置便可。

image

默認的各搜索引擎地址格式以下:

注意:使用 %SELECTION% 來替換搜索引擎選中的關鍵詞
Engine Url
Google https://www.google.com/search...
Bing https://www.bing.com/search?q...
Github https://www.github.com/search...
Baidu https://www.baidu.com/search?...
Npm https://www.npmjs.com/search?...
Yahoo https://search.yahoo.com/sear...
Wiki https://wikipedia.org/wiki/%S...
Duck https://duckduckgo.com/?q=%SE...
Code Pen https://codepen.io/search/pen...
Code Sandbox https://codesandbox.io/search...

好比,你能夠鍵入一個顏色網站的搜索引擎,之後打着打着代碼就能夠隨時進入一波賢者模式了(手動滑稽)。

image

哼,你還能夠經過修改 .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.visualstu...

image

有了這些,你能夠一鍵在 Github 上搜索相關代碼,在 Npm 搜索相關的工具庫,在 Wiki 檢索專業得詞條,在 Duck Duck Go 留下你不可告人的小祕密,在 Code Pen 粘貼幾段小代碼回來,總之就是不講道理,毫無武德。

image

切換翻譯引擎

通常狀況,你能夠在設置面板更改須要翻譯的語言,默認設置是英文翻譯成中文。

image

可是若是遇到二般狀況,好比趕上俄國人寫的代碼和註釋,你想翻譯一下,那麼你能夠把翻譯引擎切換到俄語翻譯成中文的設置,這裏支持世界上大部分語言的線上翻譯,谷歌翻譯是個好東西,後續會增長百度翻譯引擎的支持,請你們多多資瓷啦~

感謝

最後若是插件對您有幫助,懇請您在 插件商城 中給咱們一個五星好評,您的鼓勵是我前進的最大動力!

若是您有任何問題和建議,您能夠進入 反饋連接 留言,我會盡快回復您。

相關文章
相關標籤/搜索