开心六月综合激情婷婷|欧美精品成人动漫二区|国产中文字幕综合色|亚洲人在线成视频

    1. 
      
        <b id="zqfy3"><legend id="zqfy3"><fieldset id="zqfy3"></fieldset></legend></b>
          <ul id="zqfy3"></ul>
          <blockquote id="zqfy3"><strong id="zqfy3"><dfn id="zqfy3"></dfn></strong></blockquote>
          <blockquote id="zqfy3"><legend id="zqfy3"></legend></blockquote>
          打開APP
          userphoto
          未登錄

          開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

          開通VIP
          vscode前端常用插件推薦,搭建JQuery、Vue等開發(fā)環(huán)境

            vscode是微軟開發(fā)的的一款代碼編輯器,就如官網(wǎng)上說的一樣,vscode重新定義(redefined)了代碼編輯器。當(dāng)前市面上常用的輕型代碼編輯器主要是:sublime,notepad++,editplus,atom這幾種。比起notepad++、editplus,vscode集成了許多IDE才具有的功能,比起它們更像一個(gè)代碼編輯器;比起sublime,vscode顏值更高,安裝配置插件更為方便;比起atom,vscode啟動(dòng)速度更快,打開各種大文件不卡??梢哉f,vscode既擁有高自由度、又擁有高性能和高顏值,最關(guān)鍵的是,vscode還是一款免費(fèi)并且有團(tuán)隊(duì)持續(xù)快速更新的代碼編輯器??梢哉f,vscode是代碼編輯器的首選。個(gè)人推薦編寫前端代碼時(shí),代碼編輯器選擇vscode,IDE選擇WebStorm。

            vscode安裝插件只需要點(diǎn)擊圖片所示按鈕,即可進(jìn)入拓展,在搜索框中輸入插件名點(diǎn)擊安裝后,等待安裝好即可點(diǎn)擊重新加載重啟vscode使得插件生效。

            當(dāng)你不需要某個(gè)插件時(shí)只需要進(jìn)入擴(kuò)展,點(diǎn)擊對(duì)應(yīng)插件右下角的齒輪按鈕即可選擇禁用或卸載該插件。

           

            下面,我將推薦一些我認(rèn)為對(duì)編寫前端代碼比較有幫助的vscode插件:

            1.Auto Close Tag

            自動(dòng)閉合HTML/XML標(biāo)簽


           

             2.Auto Rename Tag

            自動(dòng)完成另一側(cè)標(biāo)簽的同步修改

           

            

            3.Beautify

            格式化代碼,值得注意的是,beautify插件支持自定義格式化代碼規(guī)則,例如:

          1
          2
          3
          4
          5
          6
          7
          {
            "indent_size": 4,
            "indent_char": " ",
            "css": {
              "indent_size": 2
            }
          }

            mac版vscode中beautify的默認(rèn)格式化代碼按鍵為cmd+b,也可以自定義快捷鍵

           

           

            4.Bracket Pair Colorizer

            給括號(hào)加上不同的顏色,便于區(qū)分不同的區(qū)塊,使用者可以定義不同括號(hào)類型和不同顏色

           

           

            5.Debugger for Chrome

            映射vscode上的斷點(diǎn)到chrome上,方便調(diào)試

           

           

            6.ESLint

            js語法糾錯(cuò),可以自定義配置,不過配置較為復(fù)雜,建議使用網(wǎng)上一些廣泛使用的eslint配置,日后我也會(huì)專門針對(duì)eslint配置寫一篇文章。

           

           

            7.GitLens

            方便查看git日志,git重度使用者必備

           

           

            8.HTML CSS Support

            智能提示CSS類名以及id 

           

           

            9.HTML Snippets

            智能提示HTML標(biāo)簽,以及標(biāo)簽含義

           

           

            10.JavaScript(ES6) code snippets

            ES6語法智能提示,以及快速輸入,不僅僅支持.js,還支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各種包含js代碼文件的時(shí)間

           

           

            11.jQuery Code Snippets

            jQuery代碼智能提示

           

           

            12.Markdown Preview Enhanced

            實(shí)時(shí)預(yù)覽markdown,markdown使用者必備

           

           

            13.markdownlint

            markdown語法糾錯(cuò)

           

           

            14.Material Icon Theme

            個(gè)人認(rèn)為最好的vscode圖標(biāo)主題,支持更換不同色系的圖標(biāo),值得點(diǎn)出的是,該插件更新極其頻繁,基本和vscode更新頻率保持一致

           

           

            15.open in browser

            vscode不像IDE一樣能夠直接在瀏覽器中打開html,而該插件支持快捷鍵與鼠標(biāo)右鍵快速在瀏覽器中打開html文件,支持自定義打開指定的瀏覽器,包括:Firefox,Chrome,Opera,IE以及Safari

           

           

            16.Path Intellisense

            自動(dòng)提示文件路徑,支持各種快速引入文件

           

           

            17.React/Redux/react-router Snippets

            React/Redux/react-router語法智能提示

           

           

            18.Vetur

            Vue多功能集成插件,包括:語法高亮,智能提示,emmet,錯(cuò)誤提示,格式化,自動(dòng)補(bǔ)全,debugger。vscode官方欽定Vue插件,Vue開發(fā)者必備。

           

           

            總結(jié):vscode自從發(fā)布以來就橫掃各大社區(qū)(畢竟微軟爸爸),成為了許多開發(fā)者的首選代碼編輯器。我根據(jù)個(gè)人vscode使用經(jīng)驗(yàn)推薦了以上18個(gè)插件,希望能對(duì)大家有所幫助。同時(shí),也歡迎大家進(jìn)行交流!

           

            2018.3.19更新:應(yīng) @雨霧星天 同學(xué)的要求,添加angular相關(guān)的vscode插件推薦。

            1.Angular Files

            集成了angular-cli的功能

            

           

            2.Angular 5 Snippets

            angular智能語法提示

           

            

            歡迎大家進(jìn)行交流~

          本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
          打開APP,閱讀全文并永久保存 查看更多類似文章
          猜你喜歡
          類似文章
          好用的markdown 編輯器有哪些?這幾款操作簡單
          10大Sublime下的JS/NodeJs開發(fā)插件,你都用過沒?
          影響了一代代前端人的 21 個(gè)里程碑式的頂級(jí)開源項(xiàng)目!
          markdown怎么用?操作方法很簡單
          VS code 高效使用說明(二)
          前端開發(fā)利器 WebStorm 2023.1 版本正式發(fā)布!
          更多類似文章 >>
          生活服務(wù)
          分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
          綁定賬號(hào)成功
          后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
          如果VIP功能使用有故障,
          可點(diǎn)擊這里聯(lián)系客服!

          聯(lián)系客服