首頁 開發工具 VSCode 提高開發效率的 VSCode 外掛程式(極力推薦!)

提高開發效率的 VSCode 外掛程式(極力推薦!)

Dec 09, 2020 pm 05:40 PM
vscode 外掛

提高開發效率的 VSCode 外掛程式(極力推薦!)

相關推薦:《vscode教學

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

使用

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

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

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

  • https://ext.dcloud.net.cn/plugin?id=355提高開發效率的 VSCode 外掛程式(極力推薦!)

搜尋

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

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

翻譯

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

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

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

切換搜尋引擎

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

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

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

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

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

##https://www.npmjs. com/search?q=%SELECTION%Yahoohttps://search.yahoo.com/search?p=%SELECTION%#Wikihttps://wikipedia.org/wiki/%SELECTION%Duckhttps:// duckduckgo.com/?q=%SELECTION%Code Penhttps://codepen.io/search/pens?q=%SELECTION%Code Sandboxhttps://codesandbox.io/search?query=%SELECTION%
Engine Url
Google https: //www.google.com/search?q=%SELECTION%
Bing https://www.bing.com/search?q=%SELECTION %
Github https://www.github.com/search?q=%SELECTION%
Baidu https://www.baidu.com/search?q=%SELECTION%
#Npm
例如,你可以鍵入一個

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

提高開發效率的 VSCode 外掛程式(極力推薦!)

哼,你也可以透過修改

.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 外掛程式(極力推薦!)

切換翻譯引擎

#一般情況,你可以在設定面板上改變需要翻譯的語言,預設設定是英文翻譯成中文。

但如果遇到二般情況,例如遇上俄國人寫的程式碼和註釋,你想翻譯一下,那麼你可以把翻譯引擎切換到俄文翻譯成中文的設置,這裡支持世界上大部分語言的線上翻譯,谷歌翻譯是個好東西,後續會增加百度翻譯引擎的支持,請大家多多資瓷啦~

更多編程相關知識,請造訪:

程式設計影片! !

以上是提高開發效率的 VSCode 外掛程式(極力推薦!)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

vscode怎麼查看word文件 vscode檢視word文件的方法 vscode怎麼查看word文件 vscode檢視word文件的方法 May 09, 2024 am 09:37 AM

首先,在電腦上開啟vscode軟體,點選左邊的【Extension】(擴充)圖標,如圖中①所示然後,在擴充介面的搜尋框中輸入【officeviewer】,如圖中②所示接著,從搜尋結果中選擇【officeviewer】安裝,如圖中③所示最後,開啟文件,如docx,pdf等,如下圖

vscode怎麼繪製流程圖_visual_studio code繪製流程圖的方法 vscode怎麼繪製流程圖_visual_studio code繪製流程圖的方法 Apr 23, 2024 pm 02:13 PM

首先要開啟電腦中的visualstudiocode,點選左側四個方塊按鈕然後在搜尋方塊中輸入draw.io查詢插件,點選安裝安裝好後,新建一個test.drawio檔案接著選取test.drawio文件,進入編輯模式左側有各種圖形,隨意選擇,就可以繪製流程圖了繪製好後,點擊檔案→嵌入→svg下面再選擇嵌入複製svg程式碼將複製的svg程式碼貼到html程式碼中開啟html網頁,就可以看到繪製的流程圖了點擊網頁上的圖片,就可以跳轉頁面在該頁面可以放大縮小流程圖在這裡,我們選擇點擊右下角的鉛筆圖案,跳轉網

加州理工華人用AI顛覆數學證明!提速5倍震驚陶哲軒,80%數學步驟全自動化 加州理工華人用AI顛覆數學證明!提速5倍震驚陶哲軒,80%數學步驟全自動化 Apr 23, 2024 pm 03:01 PM

LeanCopilot,讓陶哲軒等眾多數學家讚不絕口的這個形式化數學工具,又有超強進化了?就在剛剛,加州理工學院教授AnimaAnandkumar宣布,團隊發布了LeanCopilot論文的擴展版本,更新了程式碼庫。圖片論文地址:https://arxiv.org/pdf/2404.12534.pdf最新實驗表明,這個Copilot工具,可以自動化80%以上的數學證明步驟了!這個紀錄,比以前的基線aesop還要好2.3倍。並且,和以前一樣,它在MIT許可下是開源的。圖片他是一位華人小哥宋沛洋,他是

vscode怎麼開啟後台更新 vscode開啟後台更新方法 vscode怎麼開啟後台更新 vscode開啟後台更新方法 May 09, 2024 am 09:52 AM

1.首先,開啟介面後,點選左上角的檔案選單2.隨後,在首選項欄目中點選設定按鈕3.接著,在跳轉的設定頁面中,找到更新板塊4.最後,滑鼠點選勾選啟用在Windows上後台下載和安裝新的VSCode版本按鈕,並重新啟動程式即可

vscode工作區怎麼加入檔案 vscode工作區新增檔案的方法 vscode工作區怎麼加入檔案 vscode工作區新增檔案的方法 May 09, 2024 am 09:43 AM

1.首先,打開vscode軟體,點擊資源管理器圖標,找到工作區視窗2.然後,點擊左上角的檔案選單,找到將資料夾新增至工作區選項3.最後,在本機磁碟中找到資料夾位置,點擊新增按鈕即可

vscode怎麼禁止wsl設定檔 vscode禁止wsl設定檔方法 vscode怎麼禁止wsl設定檔 vscode禁止wsl設定檔方法 May 09, 2024 am 10:30 AM

1.首先,開啟設定選單中的settings選項2.隨後,在跳轉的commonlyused頁面中找到terminal欄3.最後,在該欄位右側取消勾選usewslprofiles按鈕即可

VScode怎麼設定動畫平滑插入 VScode設定動畫平滑插入教學 VScode怎麼設定動畫平滑插入 VScode設定動畫平滑插入教學 May 09, 2024 am 09:49 AM

1.首先,開啟介面後,點選工作區介面2.然後,在開啟的編輯面板中,點選檔案選單3.隨後,點選首選項欄目下的設定按鈕4.最後,滑鼠點選勾選CursorSmoothCaretAnimation按鈕,儲存設定即可

Vscode怎麼開啟工作區信任權限 Vscode開啟工作區信任權限方法 Vscode怎麼開啟工作區信任權限 Vscode開啟工作區信任權限方法 May 09, 2024 am 10:34 AM

1.首先,打開編輯視窗後,點擊左下角的配置圖示2.隨後,在開啟的子選單中點擊管理工作區信任按鈕3.接著,在編輯視窗中找到該頁面4.最後,根據自己的辦公需求勾選相關指令即可

See all articles