小編給大家分享一下vscode編譯sass的方法,希望大家閱讀完這篇文章后大所收獲,下面讓我們一起去探討吧!
使用vscode來編譯sass
第一步,在vscode中安裝easy sass 下圖是已經(jīng)安裝成功的狀態(tài)
第二步,修改vscode的配置
"easysass.compileAfterSave": true, "easysass.formats": [ //nested:嵌套縮進的 css 代碼。 //expanded:沒有縮進的、擴展的css代碼。 //compact:簡潔格式的 css 代碼。 //compressed:壓縮后的 css 代碼 { "format": "expanded", "extension": ".css" }, { "format": "compressed", "extension": ".min.css" } ], "easysass.targetDir": "css/" //路徑
第三步,新建一個文件夾,在文件夾中新建兩個文件夾,一個sass一個css,如果你沒有建css文件夾,編譯以后也會自動建一個文件夾的
第四步,然后再sass下面建立demo.sass,然后編寫
第五步,按下ctrl + s,就直接編譯了,因為你之前設(shè)置的時候設(shè)置了easysass.compileAfterSave為true,所以保存就會編譯一次,這也是為了提高開發(fā)效率
最后你會發(fā)現(xiàn)再css下面多了一個 css文件,一個min.css文件,這是和你再設(shè)置了設(shè)置的有關(guān)系的,一個沒有縮進,一個壓縮的
看完了這篇文章,相信你對vscode編譯sass的方法有了一定的了解,想了解更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
當(dāng)前文章:vscode編譯sass的方法-創(chuàng)新互聯(lián)
文章出自:http://www.rwnh.cn/article22/pjpcc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供企業(yè)網(wǎng)站制作、搜索引擎優(yōu)化、服務(wù)器托管、手機網(wǎng)站建設(shè)、做網(wǎng)站、微信小程序
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容