Prepros是一款用于Web開發(fā)的前端工具，旨在通過自動化流程提升開發(fā)效率，它支持Sass、Less、Stylus、CoffeeScript、TypeScript等多種預(yù)處理器與編譯語言，能夠在文件修改時自動重新編譯并實(shí)時刷新瀏覽器，讓開發(fā)者即時查看效果。Prepros前端開發(fā)工具還提供CSS與JavaScript的壓縮優(yōu)化、自動添加瀏覽器前綴、實(shí)時錯誤檢查與調(diào)試等功能，支持多設(shè)備與瀏覽器的同步預(yù)覽，協(xié)助開發(fā)者更高效地構(gòu)建、調(diào)試與管理前端項(xiàng)目。

Prepros特點(diǎn)

1、編譯簡單：Prepros可以輕松編譯 LESS、Sass、SCSS、Stylus、Jade、CoffeeScript、Haml和Markdown。

2、無依賴：你只要安裝Prepros即可，無需安裝Sass和Compass。

3、靈活的CSS注入：Prepros可以自動編譯CSS并將其注入瀏覽器中，同樣適用于HTML和JS。

4、內(nèi)置HTTP服務(wù)器：沒有多余文件URL限制，Prepros內(nèi)置靜態(tài)HTTP服務(wù)器來測試所有Ajax請求。

5、Background File Watch：Prepros會監(jiān)視文件的變化，并實(shí)時編譯。

6、錯誤通知：文件沒有編譯通過？別擔(dān)心，Prepros將會自動報告錯誤。

軟件功能

1、編譯一切

Prepros可以編譯幾乎所有的預(yù)處理語言，如Sass，Less，Stylus，Cssnext，Jade / Pug，Markdown，Slim，Coffeescript等。

2、突出錯誤

忘記黑屏上有數(shù)百萬的不可讀錯誤，突出你關(guān)注的錯誤。

3、實(shí)時重新加載

每次在代碼編輯器中保存文件時，Prepros會自動重新加載瀏覽器。

4、縮小和優(yōu)化

Prepros可以通過一鍵點(diǎn)擊來簡化和優(yōu)化CSS，javascript和圖像。

JS連接：連接并組合JavaScript文件以減少http請求。

文件縮?。狠p松簡化和Uglify文件，以減少帶寬和加載時間。

圖像優(yōu)化：無損地優(yōu)化圖像以減少帶寬和加載時間。

5、網(wǎng)絡(luò)預(yù)覽

Prepros內(nèi)置服務(wù)器，可以幫助您在多個設(shè)備(如手機(jī)和平板電腦)中預(yù)覽您的網(wǎng)站。

6、瀏覽器同步

Prepros可以跨多個設(shè)備同步瀏覽器，以便于測試。

滾動同步：跨瀏覽器同步滾動實(shí)時。沒有復(fù)雜的設(shè)置。

點(diǎn)擊同步：實(shí)時同步點(diǎn)擊和其他鼠標(biāo)事件。

表單同步：實(shí)時地同步用戶輸入，如表單和其他鍵盤事件。

7、遠(yuǎn)程檢查

Prepros擁有Chrome DevTools，如檢查員，用于遠(yuǎn)程檢測和調(diào)試設(shè)備。

8、構(gòu)建和部署

Prepros可以導(dǎo)出準(zhǔn)備好部署的文件，也可以通過FTP或SFTP上傳所有文件。

Prepros使用技巧

1、添加項(xiàng)目

簡單地拖放一個文件夾到prepro窗口來添加新項(xiàng)目。

2、過濾不必要的文件夾和文件

默認(rèn)情況下，prepro將監(jiān)視項(xiàng)目文件夾中的所有文件。對于小項(xiàng)目來說，這很好，但是如果您有大型的項(xiàng)目，那么單擊并過濾掉不需要自動編譯或刷新的文件夾。沒有注意更改的文件和文件夾在prepro窗口中關(guān)閉了眼睛圖標(biāo)。

3、打開實(shí)時預(yù)覽

按下CTRL + L或CMD + L，取決于你的平臺，或者使用工具欄上的地球圖標(biāo)打開實(shí)時預(yù)覽。

4、編譯文件

當(dāng)你在代碼編輯器中保存文件時，前專業(yè)人員會觀察你的文件并編譯它們。如果您想手工編譯它們，只需在prepro窗口中單擊文件，然后單擊進(jìn)程。