詳解Angular-cli生成組件修改css成less或sass的實(shí)例
更新時(shí)間：2017年07月27日 09:17:02 作者：侞婼冇罪
這篇文章主要介紹了詳解Angular-cli生成組件修改css成less或sass的實(shí)例的相關(guān)資料,這里主要講解修改angular-cli.json文件,生成css或者less,需要的朋友可以參考下
詳解Angular-cli生成組件修改css成less或sass的實(shí)例
使用cli命令生成組件:
ng generate component 組件名
生成出來(lái)的組件文件有：html / ts / css / spec.ts
問(wèn)題我是一個(gè)less重度患者怎么可能再去寫(xiě)css呢。
于是我就在想使用cli生成組件的時(shí)候能直接生成出來(lái)的是less文件而不是css文件；
修改angular-cli.json文件：
apps
"styles": [
"styles.less"
]
"defaults":
"styleExt": "less",
這樣就能用組件命令生成的時(shí)候替換css文件成less文件
但是angular代碼會(huì)報(bào)錯(cuò)，需要去修改所有的.css文件成.less文件。
ts文件內(nèi)引用的styleUrls里面的css修改成less
cli編輯不報(bào)錯(cuò)了
less編譯問(wèn)題：
less less-loader
sass文件的操作如上一樣
以上就是對(duì)Angular-cli生成組件修改css成less或sass的實(shí)例詳解，如有疑問(wèn)請(qǐng)留言或者到本站社區(qū)交流討論，本站關(guān)于AngularJS 的文章還有很多，歡迎大家搜索查閱，感謝閱讀，希望能幫助到大家，謝謝大家對(duì)本站的支持！
您可能感興趣的文章:
相關(guān)文章
本文主要介紹AngularJS國(guó)際化的知識(shí)，這里整理了相關(guān)資料和示例代碼以及實(shí)現(xiàn)效果圖，有興趣的小伙伴可以參考下2016-08-08
promise是一種用異步的方式處理值的方法，promise是對(duì)象，代表了一個(gè)函數(shù)最終可能的返回值或者拋出的異常，在與遠(yuǎn)程對(duì)象打交道時(shí)我們可以把他看作是遠(yuǎn)程對(duì)象的一個(gè)代理，通過(guò)本文給大家介紹AngularJS中處理多個(gè)promise的方式及什么是promise，需要的朋友參考下2016-02-02
本篇文章主要介紹了詳解Angular 4.x NgIf，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-05-05
Angular ElementRef簡(jiǎn)介及其使用
這篇文章主要介紹了Angular ElementRef簡(jiǎn)介及其使用，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-10-10
AngualrJS中每次$http請(qǐng)求時(shí)的一個(gè)遮罩層Directive
AngularJS是一款非常強(qiáng)大的前端MVC框架。接下來(lái)通過(guò)本文給大家介紹AngualrJS中每次$http請(qǐng)求時(shí)的一個(gè)遮罩層Directive，本文非常具有參考借鑒價(jià)值，特此分享供大家學(xué)習(xí)2016-01-01
本文主要介紹了Angular2的架構(gòu)的相關(guān)知識(shí)。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-03-03
angula中使用iframe點(diǎn)擊后不執(zhí)行變更檢測(cè)的問(wèn)題
這篇文章主要介紹了angula中使用iframe點(diǎn)擊后不執(zhí)行變更檢測(cè)問(wèn)題，本文給大家分享解決方案，通過(guò)實(shí)例代碼給的大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-05-05
詳解angularjs 學(xué)習(xí)之 scope作用域
本篇文章主要介紹了詳解angularjs 學(xué)習(xí)之 scope作用域，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-01
這篇文章主要介紹了AngularJS 單元測(cè)試（一）詳解的相關(guān)資料,需要的朋友可以參考下2016-09-09
深入解析Angular動(dòng)態(tài)導(dǎo)入和懶加載實(shí)例
這篇文章主要為大家深入解析了Angular動(dòng)態(tài)導(dǎo)入和懶加載實(shí)例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10