IntellJ idea使用FileWatch實(shí)時(shí)編譯less文件的方法
前言
開發(fā)前端的時(shí)候，經(jīng)常會(huì)寫一些less或者sass文件，但這些文件需要編譯成css文件才有效，之前會(huì)使用一些自動(dòng)化構(gòu)建工具實(shí)時(shí)監(jiān)聽項(xiàng)目文件變化，需要做些配置。
這里使用idea的file watch插件，無需額外配置，簡單方便。
操作
依賴關(guān)系
- Node.js與idea的nodejs插件
- File Watch插件
- 全局安裝less
插件位置
配置File watch
1.項(xiàng)目中新建less文件
新建less文件
2.配置less文件的file watch。
我們可以看到文件頂部有個(gè)是否開啟less文件的觀察器，點(diǎn)擊YES
配置Less的File watch
點(diǎn)擊輸出路徑最右邊的插入預(yù)定義宏(insert Macro)，可以看到預(yù)定義的宏與它代表的內(nèi)容
插入Macro界面
最終效果圖
最終配置
可以看到less被實(shí)時(shí)編譯成了css文件
實(shí)時(shí)編譯圖
額外
File watch不僅僅可以觀察less文件，實(shí)時(shí)監(jiān)聽文件變化的操作都可以處理。我們可在Idea的配置中自行配置。
File watch位置
前端我不建議使用sass編譯器，因?yàn)樵趙indows上安裝sass編譯器依賴一大堆東西，又是c++，又是python的。雖然在Mac或linux上用sass沒問題，在windows上使用會(huì)出現(xiàn)問題。less與sass功能差不多，最終也都是要編譯成css的，有了這么好用的工具還是直接使用less。
總結(jié)
以上所述是小編給大家介紹的IntellJ idea使用FileWatch實(shí)時(shí)編譯less文件的方法，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
- IntelliJ IDEA使用maven實(shí)現(xiàn)tomcat的熱部署
- IntelliJ IDEA 中使用jRebel進(jìn)行 Java 熱部署教程圖解
- IntelliJ IDEA JRebel 安裝使用圖文教程(熱部署插件)
- Intellij IDEA 熱部署處理方法(圖解)
- IDEA安裝lombok插件設(shè)置Enable Annotation Processing后編譯依然報(bào)錯(cuò)解決方法
- IntelliJ IDEA編譯項(xiàng)目報(bào)錯(cuò) "xxx包不存在" 或 "找不到符號(hào)"
- idea熱部署且開啟自動(dòng)編譯的實(shí)現(xiàn)方法
相關(guān)文章
idea中提示Class 'xxx' is never us
這篇文章主要介紹了idea中提示Class 'xxx' is never used的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-01-01
Java Agent 動(dòng)態(tài)修改字節(jié)碼詳情
這篇文章主要介紹了Java Agent動(dòng)態(tài)修改字節(jié)碼的相關(guān)資料,需要的朋友可以參考下面文章具體的內(nèi)容2021-09-09
java實(shí)現(xiàn)emqx設(shè)備上下線監(jiān)聽詳解
這篇文章主要為大家介紹了java實(shí)現(xiàn)emqx設(shè)備上下線監(jiān)聽詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
這篇文章主要為大家介紹了java變量的聲明與賦值分離規(guī)范示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09
SpringBoot 如何從配置文件讀取值到對(duì)象中
這篇文章主要介紹了SpringBoot 如何從配置文件讀取值到對(duì)象中，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2021-11-11
這篇文章主要為大家介紹了java代碼規(guī)范關(guān)于異常review代碼發(fā)生異常的事故記錄，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-06-06
Spring Core核心類庫的功能與應(yīng)用實(shí)踐分析
本文詳細(xì)介紹了SpringCore核心類庫的功能、應(yīng)用實(shí)踐和底層原理,SpringCore提供了控制反轉(zhuǎn)（IOC）、依賴注入（DI）、Bean管理以及JNDI、定時(shí)任務(wù)等企業(yè)級(jí)功能,文章通過多個(gè)Java示例展示了SpringCore的應(yīng)用,感興趣的朋友跟隨小編一起看看吧2024-12-12
這篇文章主要介紹了Java繼承方法重寫實(shí)現(xiàn)原理及解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12
Spring中使用Async進(jìn)行異步功能開發(fā)實(shí)戰(zhàn)示例(大文件上傳為例)
本文以大文件上傳為例,首先講解在未進(jìn)行程序異步化時(shí),程序的運(yùn)行機(jī)制和具體表現(xiàn),然后講解如何進(jìn)行異步化的改造,讓程序進(jìn)行異步執(zhí)行,通過本文不僅能讓你掌握如何進(jìn)行Event的事件開發(fā),同時(shí)還能掌握在Spring中如何進(jìn)行異步開發(fā),熟悉@Async的具體用法,感興趣的朋友一起看看吧2024-08-08
MyBatis-Plus updateById不更新null值的方法解決
用Mybatis-Plus的updateById()來更新數(shù)據(jù)時(shí),無法將字段設(shè)置為null值,更新后數(shù)據(jù)還是原來的值,本文就來詳細(xì)的介紹一下解決方法,具有一定的參考價(jià)值,感興趣的可以了解一下2023-08-08