資訊專欄INFORMATION COLUMN
摘要：軟件跨平臺(tái)支持以及，運(yùn)行流暢，可謂是微軟的良心之作微軟有這個(gè)宇宙最強(qiáng)，自然也不會(huì)弱宇宙最強(qiáng)編輯器說(shuō)到代碼編輯器，我們有必要提一提還有。
原文鏈接：VS Code上手與超實(shí)用插件安利
工欲善其事必先利其器
Visual Studio Code (簡(jiǎn)稱 VS Code / VSC) 是一款免費(fèi)開(kāi)源的現(xiàn)代化輕量級(jí)代碼編輯器，支持幾乎所有主流的開(kāi)發(fā)語(yǔ)言的語(yǔ)法高亮、智能代碼補(bǔ)全、自定義熱鍵、括號(hào)匹配、代碼片段、代碼對(duì)比 Diff、GIT 等特性，支持插件擴(kuò)展，并針對(duì)網(wǎng)頁(yè)開(kāi)發(fā)和云端應(yīng)用開(kāi)發(fā)做了優(yōu)化。軟件跨平臺(tái)支持 Win、Mac 以及 Linux，運(yùn)行流暢，可謂是微軟的良心之作
微軟有 Visual Studio這個(gè)宇宙最強(qiáng)IDE，Visual Studio Code 自然也不會(huì)弱(宇宙最強(qiáng)編輯器)
說(shuō)到代碼編輯器，我們有必要提一提Sublime Text還有Atom。在開(kāi)始使用VS Code之前Sublime Text一直是我的主力編輯器，和WebStorm （最強(qiáng)端前端開(kāi)發(fā)工具） 一起用。由于這篇文章主要介紹VS Code下面就簡(jiǎn)單概括下這幾個(gè)：
Sublime Text：在我的日常使用中都挺滿意，快速，穩(wěn)定。唯一不爽是證書(shū)購(gòu)買(mǎi)(雖然可以一直無(wú)限制使用)，沒(méi)有開(kāi)源
Atom：你們用著真不卡嗎？還是我電腦配置太差，不過(guò)UI真的好看
VS code：微軟開(kāi)源，比sublime開(kāi)源，比atom更快，比webstorm更輕，值得一提的是它用的殼是GitHub開(kāi)源的Electron。
主要功能Visual Studio Code首先是一個(gè)編輯器，它包含了高效的源代碼編輯所需的功能(最為一個(gè)編輯器，主要功能當(dāng)然是代碼編輯了) 我們主要還是看看特色功能。
智能感知 Intellisense智能感知是各種代碼編輯功能的總稱，包括代碼完成，參數(shù)信息，快速信息和成員列表。智能感知功能也被稱為“代碼補(bǔ)全”，“內(nèi)容幫助”和“代碼提示”，這是一個(gè)現(xiàn)代編輯器最基本的自我修養(yǎng)了。
VS Code原生就支持JavaScript，TypeScript，JSON，HTML，CSS，Less和Sass的Intellisense，真正的強(qiáng)大之處在于，可以安裝語(yǔ)言擴(kuò)展來(lái)配置更豐富的IntelliSense（幾乎包括所有主流語(yǔ)言）
內(nèi)置 GitVS Code 內(nèi)置了一個(gè) Git GUI，支持最常用 Git 命令，這使得您可以很容易地看到您在項(xiàng)目中所做的更改。當(dāng)然了，你可以通過(guò)擴(kuò)展 讓他更強(qiáng)大。
調(diào)試 DebuggingVS Code對(duì)Node.js運(yùn)行時(shí)提供了內(nèi)置的調(diào)試支持，并且可以調(diào)試JavaScript，TypeScript和任何其他被轉(zhuǎn)換為JavaScript的語(yǔ)言。對(duì)于調(diào)試其他語(yǔ)言和運(yùn)行環(huán)境時(shí)，我們也可以通過(guò)擴(kuò)展來(lái)解決。
終端命令行工具 Terminal在VS Code中提供了一個(gè)功能齊全的集成終端，這非常方便，因?yàn)槟槐厍袚Q窗口或更改現(xiàn)有終端的狀態(tài)就可以快速執(zhí)行命令
擴(kuò)展市場(chǎng) Extensio對(duì)于強(qiáng)大的插件市場(chǎng)來(lái)說(shuō)，它自帶的功能只是和開(kāi)始而已。隨著VS Code的流行，基本上你能找到所有你想要的插件(實(shí)在找不到你還可以自己開(kāi)發(fā))。
更多請(qǐng)查閱https://code.visualstudio.com/docs
開(kāi)始上手關(guān)于VS Code的使用也很簡(jiǎn)單
下載安裝：去到它的官網(wǎng)https://code.visualstudio.com/，下載對(duì)應(yīng)版本，然后按照提示一直下一步就好
基本使用：在你安裝好后，就可以看到有用的用戶歡迎指引界面
你可以在學(xué)習(xí)欄點(diǎn)擊各項(xiàng)，迅速上手這個(gè)編輯器÷。下面主要就是推薦一些好用插件了，
插件安裝方式關(guān)于插件的安裝，在看了界面概述后也應(yīng)該是知道怎么安裝了：
直接在擴(kuò)展管理中鍵入你要下載的擴(kuò)展名稱或者關(guān)鍵字搜索下載
使用快捷鍵?+?+P，打開(kāi)命令面板，輸入如下命令即可
ext install 擴(kuò)展名
還可以從插件主頁(yè)直接點(diǎn)擊下載，他會(huì)喚起VS Code自動(dòng)下載
基本配置關(guān)于VS Code的各項(xiàng)設(shè)置，都在一個(gè)JSON文件中，左邊是默認(rèn)設(shè)置，右邊是我們自己的設(shè)置，分為用戶設(shè)置和工作區(qū)設(shè)置，我們只需要在右邊我們編輯設(shè)置并保存即可。工作區(qū)設(shè)置后各項(xiàng)設(shè)置會(huì)保存在.vscode文件夾下。
新安裝一個(gè)編輯/IDE，最先干的就是調(diào)字體(vscode 中可以直接按?加加號(hào)/減號(hào)調(diào)節(jié)字體)，調(diào)顏色等外觀配置了吧。
主題推薦VS Code已經(jīng)自帶了很多個(gè)好看的主題，比如說(shuō)我一直用的Solarized Dark
這里我再推薦幾個(gè)不錯(cuò)的，
One Dark Pro： Atom 標(biāo)志性的主題
Atom One Dark Theme： 另一個(gè)基于 One Dark 的主題
Dracula Official：超好看
Material Theme 一個(gè)簡(jiǎn)單而又干凈的主題，有很多配置選項(xiàng)用于顏色配置
單單安裝了主題還不夠，我們還要好看的圖標(biāo)來(lái)足視覺(jué)體驗(yàn)：
vscode icons
Material Icon Theme
更多好看主題請(qǐng)瀏覽https://marketplace.visualstudio.com/search?target=VSCode&category=Themes
實(shí)用插件filesize：在底部狀態(tài)欄顯示當(dāng)前文件大小，點(diǎn)擊后還可以看到詳細(xì)創(chuàng)建、修改時(shí)間
Path Intellisense：文件路徑補(bǔ)全，在你用任何方式引入文件系統(tǒng)中的路徑時(shí)提供智能提示和自動(dòng)完成
vscode-fileheader：頂部注釋模板，可定義作者、時(shí)間等信息，并會(huì)自動(dòng)更新最后修改時(shí)間
Git Lens：查看詳細(xì)的git記錄,內(nèi)置功能很多
Git History (git log)：一個(gè)好用的Git 歷史查看工具
npm: 可以直接在vscode執(zhí)行npm的一些命令
Npm Intellisense：NPM 依賴補(bǔ)全，在你引入任何 node_modules 里面的依賴包時(shí)提供智能提示和自動(dòng)完成
Debugger for Chrome：讓 vscode 映射 chrome 的 debug功能，靜態(tài)頁(yè)面都可以用 vscode 來(lái)打斷點(diǎn)調(diào)試
JavaScript (ES6) code snippets：常用的類聲明、ES 模塊聲明、CMD 模塊導(dǎo)入等
ESLint：代碼語(yǔ)法檢查
Beautify：格式化代碼的工具
open-in-browser： 在瀏覽器中預(yù)覽HTM文件
HTML Snippets：各種 HTML 標(biāo)簽片段
IntelliSense for CSS class names：CSS 類名補(bǔ)全，會(huì)自動(dòng)掃描整個(gè)項(xiàng)目里面的 CSS 類名并在你輸入類名時(shí)做智能提示
Document This： js 的注釋模板
Settings Sync：同步你得設(shè)置和插件
結(jié)語(yǔ)我們從外觀配置開(kāi)始到插件推薦結(jié)束，到此基本上你就能打造出一個(gè)有自己風(fēng)格強(qiáng)大編輯器，開(kāi)發(fā)效率自然也是很高。你有什么好用的插件？歡迎留言交流！讓更多的人知道。
同時(shí)，建議移步官網(wǎng)看看https://code.visualstudio.com/，那兒有更全更細(xì)的文檔，有助于我們更好的使用它。
歡迎關(guān)注微信公眾號(hào)：
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/89991.html
摘要：因?yàn)橛脩舨挥迷诘谝淮芜M(jìn)入應(yīng)用時(shí)下載所有代碼，用戶能更快的看到頁(yè)面并與之交互。譯高階函數(shù)利用和來(lái)編寫(xiě)更易維護(hù)的代碼高階函數(shù)可以幫助你增強(qiáng)你的，讓你的代碼更具有聲明性。知道什么時(shí)候和怎樣使用高階函數(shù)是至關(guān)重要的。 Vue 折騰記 - (10) 給axios做個(gè)挺靠譜的封裝(報(bào)錯(cuò),鑒權(quán),跳轉(zhuǎn),攔截,提示) 稍微改改都能直接拿來(lái)用~~~喲吼吼,喲吼吼..... 如何無(wú)痛降低 if else 面...
摘要：我們團(tuán)隊(duì)有大部分人已經(jīng)在用了，所以這周五在組內(nèi)做了一個(gè)小分享，來(lái)發(fā)掘一些提高開(kāi)發(fā)效率的小技巧。為什么選擇在剛出來(lái)的時(shí)候，我就開(kāi)始使用了如何評(píng)價(jià)理由很簡(jiǎn)單開(kāi)源，免費(fèi)，顏值高微軟出品，實(shí)力保證。 showImg(https://segmentfault.com/img/remote/1460000010750652); 沒(méi)錯(cuò)，我就是來(lái)給大家安利 VS Code 的。 對(duì)前端來(lái)說(shuō)，這是一款性...
摘要：如果想配置開(kāi)發(fā)工具面向前端及開(kāi)發(fā)人員的配置如果想配置開(kāi)發(fā)工具配置及使用技巧所謂網(wǎng)紅編輯器，我覺(jué)得比來(lái)的更爽，因?yàn)榈乃胁僮骱筒寮瑢?duì)于來(lái)說(shuō)也就是一個(gè)插件就能無(wú)縫兼容。作為一個(gè)前端開(kāi)發(fā)，開(kāi)箱即用的代碼編輯高亮提示都十分友好。 如果想配置 sublime 開(kāi)發(fā)工具 => 面向web前端及node開(kāi)發(fā)人員的vim配置 如果想配置 vim 開(kāi)發(fā)工具 => sublime配置及使用技巧 所謂網(wǎng)紅...
摘要：以下簡(jiǎn)稱是微軟開(kāi)發(fā)同時(shí)支持和系統(tǒng)且開(kāi)放源代碼的代碼編輯器，并且是開(kāi)源免費(fèi)使用的，也是當(dāng)下最受歡迎的代碼編輯器之一官網(wǎng)下載地址文章已更新插件折騰記二經(jīng)過(guò)我一段時(shí)間的使用，發(fā)現(xiàn)一些插件是必不可少的，現(xiàn)在給大家推薦一些非常實(shí)用的插件下載好安裝打開(kāi) Visual Studio Code（以下簡(jiǎn)稱vs code） 是 微軟開(kāi)發(fā)同時(shí)支持Windows、Linux、和macOS系統(tǒng)且開(kāi)放源代碼的代碼...
摘要：以下簡(jiǎn)稱是微軟開(kāi)發(fā)同時(shí)支持和系統(tǒng)且開(kāi)放源代碼的代碼編輯器，并且是開(kāi)源免費(fèi)使用的，也是當(dāng)下最受歡迎的代碼編輯器之一官網(wǎng)下載地址文章已更新插件折騰記二經(jīng)過(guò)我一段時(shí)間的使用，發(fā)現(xiàn)一些插件是必不可少的，現(xiàn)在給大家推薦一些非常實(shí)用的插件下載好安裝打開(kāi) Visual Studio Code（以下簡(jiǎn)稱vs code） 是 微軟開(kāi)發(fā)同時(shí)支持Windows、Linux、和macOS系統(tǒng)且開(kāi)放源代碼的代碼...
閱讀 2231·2021-11-22 09:34
閱讀 1342·2021-10-11 10:59
閱讀 4442·2021-09-22 15:56
閱讀 3296·2021-09-22 15:08
閱讀 3411·2019-08-30 14:01
閱讀 782·2019-08-30 11:16
閱讀 1136·2019-08-26 13:51
閱讀 2915·2019-08-26 13:43
