為常用的工具和語言自訂Sublime Text的編譯系統

Custom Sublime Text Build Systems For Popular Tools And Languages【為常用的工具和語言自訂Sublime Text的編譯系統】

慣例上連結：點我點我

這個是想看看演算法又不想裝IDE的時候準備配置一下Sublime。關鍵是看了一下前面的解說部分，後面具體的配置沒有用這個文章中的，但是既然已經順便翻譯完了就放上來。。。。。

為了比之前的文章看著舒服開始換markdown編輯器了。

譯文:

Sublime Text是目前開源社區的很多開發人員所選擇。它很複雜，並且具有強大的文本選擇和自訂支援，同時它還有很多其它文字編輯器所不具備的一項功能——它的編譯系統。在這篇文章中，我將向你們介紹Sublime的編譯系統，同時分享幾個我們現在經常用的語言和工具的編譯指令碼。

它們包括用於Grunt，CoffeeScript，SASS等的指令碼。

介紹

Sublime Text編譯系統可以說很簡單，但卻是可高度自訂的，其基本思想就是每個類型的編譯設定檔都是由一個“.sublime-buile” file -a JSON 的聲明來使其生效，這個聲明包括使用一個特定工具（或一系列工具）來編譯一個工程需要的命令、路徑以及配置項。

編譯操作可以用鍵盤快速鍵（Mac上預設是Command+B，Windows上是F7）來實現，或者在檔案儲存之後用工具菜單中的build實現。對於當前開啟的工程，它會自動記得上次選擇的（例如grunt）編譯系統。 

當通過一個“.sublime-build”檔案向Sublime傳遞外部工具/二進位檔案參數時，它可以使用任何需要的參數或標誌。它還能用Sublime中內建的控制台將調用的這些應用的輸出重新導回。這種能夠不用離開編輯器而輕鬆編譯工程的工作模式很有效率。

增加一個自訂編譯系統[Adding a custom Build System]

Sublime通過存放在Sublime“Packages”目錄下的“.sublime-build”檔案構成其工具/編譯系統目錄。如果有人需要定位到這個檔案夾的話，可以在”~/Library/Application Support/Sublime Text2/Packeges/User”（如果是用OS X）目錄下找到，如果是其它平台也可以在相應的Packages/User目錄下找到。 

一個基本的“.sublime-build”檔案可以是如下的關鍵字/值形式：

{"cmd": ["command", "argument", "--flag"],"selector": ["source.js"],"path": "/usr/local/bin","working_dir": "/projects/"}

支援的關鍵字包括： 
- cmd——一個數組，包括要執行的命令，以及該命令要求提供的參數（argument）和標識（flags）。注意，Sublime會檢查你列出的所有工具的路徑，除非已經有一個絕對路徑指向它們。 
- selector——一個可選字串，用來指定對於當前檔案範圍來說最優的編譯器。這一項僅僅在工具/編譯系統/自動（Tools/Build System/Automatic）為真時有用。 
- path——一個可選字串，用於在列出的命令被調用之前替換你的當前進程路徑。 
- working_dir——一個可選字串，定義一個目錄來將目前的目錄切換為調用任意命令時的優先目錄。 
- shell——一個可選布爾值，用於定義命令是否用shell（例如 bash）執行。 
- file_regex——一個可選Regex，用於擷取指令的錯誤輸出。

如果需要Sublime編譯指令碼中支援的關鍵字完整列表，可以查看unofficial docs。

編譯變數： 
除此之外，Sublime支援在編譯檔案中使用變數替換，例如$file_path（當前檔案的路徑）等。它們包括： 
- $file_path——當前查看的檔案目錄 
- $file_name——僅指當前檔案（包括副檔名）的名字部分 
- $file_base_name——當前檔案（不包括副檔名）的名字部分 
- $project_path——當前工程路徑 
- $project_name——當前工程的名字

所有支援的替換（substitutions）列表。

編譯任務歸類[Grouping build tasks] 
一些開發人員還喜歡用一個外部bash指令碼（或類似的）將任務歸類。舉例來說，這裡有一個簡單的git-ftp配置指令碼（deploy script），你可以通過它在Sublime中用Git來commit和push你的最新修改，然後將最新的檔案上傳到FTP。

例子：Commit, Push And Upload To FTP 
deployment.sh:

#!/bin/bashgit add . && git commit -m 'deployment' && git push && git ftp init -u username  -p password - ftp://host.example.com/public_html

1 2 1 2

deployment.sublime-build:

{    "cmd": ["deployment"],    "working_dir": "${project_path:${folder}}"}

1 2 3 4 1 2 3 4

如果你以前沒有用過git-ftp，Alex Fluger有篇關於如何使用它的比較全面的文章你可能會感興趣。

確定目標平台[Targeting Platforms] 
Sublime編譯檔案還支援針對特定平台（即：OS X，Windows，Linux）指明配置資料。通過用平台的名字確定設定檔（config）中的其它元素，可以很輕鬆地確定目標平台，例如：

{    "cmd": ...    ...    "windows":    {    "cmd":  ...    },    "osx":    {        "cmd": ...    },    "linux":    {        "cmd": ...    }}

針對流行的前端（front-end）工具編譯檔案[Build files for popular front-end tools] 
為了協助你開始，針對我所注意到的當下web開發人員使用的一些前端工具，已經在下面列出了一系列“.sublime-build”檔案。

以上大部分都可以在沒有指定path的時候正常工作，但是如果你遇到了和path相關的問題，可以嘗試將它include進你的config檔案中（例如：”path”: “usr/local/bin”） 
grunt：

{    "cmd": ["grunt", "--no-color"],    "selector": ["source.js", "source.less", "source.json"]}

1 2 3 4 1 2 3 4

Node Build Script:

{    "cmd": ["h5bp", "--no-color"],    "selector": ["source.js", "source.less", "source.json"]}

1 2 3 4 1 2 3 4

CoffeeScript:

{    "cmd": ["coffee","-c", "$file"],    "selector" : "source.coffee"}

1 2 3 4 1 2 3 4

SASS:

{    "cmd": ["sass", "--watch", ".:."],    "working_dir": "$file_path",    "selector": ["source.scss", "source.sass"]}

1 2 3 4 5 1 2 3 4 5

與此同時有一個更加詳細版本的config，包括自動縮小和查看，如下：

{    "cmd": ["sass", "--watch", "sass:stylesheets", "--style", "compressed"],    "working_dir": "$project_path",    "selector": ["source.scss", "source.sass"]}

1 2 3 4 5 1 2 3 4 5

LESS:

{    "cmd": ["lessc", "-x", "$file", "$file_path/$file_base_name.css", "--verbose"],    "shell" : true,    "selector": "source.css.less"}

1 2 3 4 5 1 2 3 4 5

Stylus:

{    "cmd": ["stylus", "$file"],    "file_regex": ".",    "selector": "source.stylus"}

1 2 3 4 5 1 2 3 4 5

（一個更加複雜的版本可以在LESS-build-sublime工程中找到）

Jade:

{   "cmd": ["cmd", "/c", "jade", "$file"],   "selector": "source.jade"}

1 2 3 4 1 2 3 4