首頁技術(shù)文章正文

Visual Studio的下載和安裝【W(wǎng)eb前端開發(fā)】

更新時間:2022-06-01 來源:黑馬程序員 瀏覽量:

Visual Studio Code是由微軟公司推出的一款免費、開源的代碼編輯器,一經(jīng)推出便受到開發(fā)者的歡迎。對于Web前端開發(fā)人員,一個強大的編輯器可以使開發(fā)變得簡單、便捷、高效。

Visual Studio Code

Visual Studio Code編輯器特點:

1.輕巧、極速,占用系統(tǒng)資源較少。

2.具備智能代碼補全、語法高亮顯示、自定義快捷鍵和代碼匹配等功能。

3.跨平臺,可用于macOS、Windows和Linux系統(tǒng)。

4.主題界面的設(shè)計比較人性化。例如,可以快速查找文件并直接進行開發(fā),可以通過分屏顯示代碼,可以自定義主題顏色(默認為黑色),也可以快速查看最近打開的項目文件和查看項目文件結(jié)構(gòu)。

5.提供豐富的擴展(extension),用戶可根據(jù)需要自行下載和安裝擴展。常用的擴展有Chinese和Live Server等。

Visual Studio Code的下載安裝

下載Visual Studio Code編輯器首先要到Visual Studio Code官方網(wǎng)站下載軟件到本地。
Visual Studio Code官網(wǎng)

雙擊安裝包啟動安裝程序。

啟動安裝程序

點擊下一步,進入準(zhǔn)備安裝界面,點擊安裝開始Visual Studio Code編輯器。
Visual Studio Code準(zhǔn)備安裝界面

Visual Studio Code編輯器主界面
Visual Studio Code主界面

點擊設(shè)置按鈕可以將主界面默認顏色(黑色)設(shè)置為"Light +(default light)"。
設(shè)置主界面顏色
設(shè)置后的效果如下:
Visual Studio Code設(shè)置顏色效果

安裝Chinese擴展

將Visual Studio Code編輯器的語言(默認英文)設(shè)置為中文。

實現(xiàn)步驟:單擊左邊欄中的第5個圖標(biāo)按鈕(Extensions擴展按鈕)然后在搜索框中輸入關(guān)鍵詞“Chinese"找到中文語言擴展,最后單擊"Install”按鈕進行安裝。

安裝Chinese擴展

安裝Live Server擴展

Live Server擴展可以創(chuàng)建一個本地服務(wù)器來預(yù)覽網(wǎng)頁,服務(wù)器的默認端口是5500,用戶也可以自行設(shè)置端口號、默認瀏覽器等。使用Live Server擴展運行程序時,如果對代碼進行了修改,不需要重新刷新瀏覽器即可更新頁面內(nèi)容。

具體安裝步驟:單擊左邊欄中的第5個圖標(biāo)按鈕(Extensions擴展按鈕),然后在搜索框中輸入關(guān)鍵詞“l(fā)ive server”找到該擴展,單擊“安裝”按鈕進行安裝。



分享到:
在線咨詢 我要報名
和我們在線交談!