> prepros:簡化多語言網絡開發預處理
Prepros是一種免費,開源且功能強大的工具,旨在簡化Web開發中多語言預處理的複雜性。 Prepros支持多種語言,包括Limes,Sass,SCSS,Compass,Cossipscript,coffeescript,coffeescript,Livesscript,STYLUS,JADE,SLIM,MARKDOWN和HAML,Prepros提供了一個零依賴性的多合一解決方案。 不需要其他安裝或配置。>
關鍵功能和優點:
解決預處理的挑戰:
> 現代網絡開發在很大程度上依賴於預處理語言,以增強HTML,CSS和JavaScript開發的速度,易度和靈活性。但是,管理多個預處理器可能會變得麻煩。 Prepros通過提供單個集成解決方案來優雅地解決此問題,從而消除了對單個語言安裝和配置的需求。
> prepros的工作方式:
要使用Prepros,只需創建一個包含所有預處理文件(在文件夾及其子文件夾中)的項目文件夾即可。將此文件夾拖放到Prepros應用程序窗口中。 Prepros將自動識別並列出所有可編譯的文件。 該工具可以智能處理導入的文件,在後台監視它們,並在任何更改時重新編譯父文件。記住在添加或導入新文件以反映更改後刷新項目。 PrePros提供顆粒狀的自定義選項,可通過右側面板進行單個文件配置。可以通過項目工具欄管理項目範圍的設置,而全局設置可通過Prepros選項窗口訪問(通過右上菜單訪問)。
>少量和咖啡本的快速測試: >
(在“ CSS”文件夾中):
> Prepros顯著簡化了預處理工作流程,使多語言Web開發更加高效和愉快。 它的易用性和功能強大的功能使其成為所有技能水平和項目量表開發人員的寶貴工具。 有關更多詳細信息,請參閱官方的Prepros文檔。 >>為了說明Prepros的功能,讓我們使用Limes和Coffeescript創建一個簡單的測試項目。 創建一個項目文件夾(“ Prepros Testing”),以及“ CSS”和“ JS”子文件夾。然後,創建一個test.html文件(引用要編譯的CSS和JavaScript文件):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Prepros Test</title>
<link href="css/test.css" rel="stylesheet" type="text/css" />
<🎜>
</head>
<body>
<hr />
<div class="round-rect"></div>
</body>
</html>
test.less
.rounded-corners (@radius: 5px) {
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
-ms-border-radius: @radius;
-o-border-radius: @radius;
border-radius: @radius;
}
.round-rect {
width: 100px;
height: 100px;
background-color: orange;
.rounded-corners(10px);
}
test.coffee
>將項目添加到prepros,編譯所有文件中,並打開square = (x) -> x * x
cube = (x) -> square(x) * x
getCube = ->
document.write "The result is: " + cube(4)
getCube()
test.html
結論:
以上是與Prepros的多語言預處理的詳細內容。更多資訊請關注PHP中文網其他相關文章!