Sublime Text 插件 autoprefixer

Sublime Text 早就有插件（Sublime Prefixr）使用 prefixr 的 API 來自動完成 CSS 前綴，但是 autoprefixer 更牛，這款可使用 Can I Use 的資料庫。
插件官方網址：Sublime Autoprefixer on GitHub

/* 使用前 */
body {
  background: linear-gradient(to bottom, #DADADA, #000);
}

p a {
  -webkit-border-radius: 5px;
  border-radius: 5px
}




/* ------------------------
 * 使用后
 */
body {
  background: -webkit-linear-gradient(top, #DADADA, #000);
  background: linear-gradient(to bottom, #DADADA, #000);
}

p a {
  border-radius: 5px;
}

效果明顯，多於的 CSS 會自動刪掉，border-radius 早就已經不需要前綴了（參考 caniuse border-radius），只有 Firefox 3.6，Chrome 4，Safari 4 和 Android 2.1 需要前綴；而 參考 caniuse css graident 桌面版的 Firefox 15 和 Chrome 25 或者更舊的版本 和目前手機版的游覽器才需要前綴。

安裝

使用 Package Control，安裝 Autoprefixer，然后重啟 Sublime Text

系統需求

電腦需要安裝 Node.js

使用方法

按 Ctrl + Shift + P，然后選 Autoprefix CSS 或者設置鍵盤快捷鍵 – “Preferences > Key Bindings – User”

[
    { "keys": ["ctrl+alt+x"], "command": "autoprefixer" }
]

選項

打開選項
Preferences > Package Settings > Autoprefixer > Settings – User

默認設置：
過去2個版本（如果 Chrome 30 是最新版的，這款插件自動選 Chrome 28 – 30 的版本來判斷否需要前綴）

配置參數

last n versions 支持過去n個版本

n% 全球使用率大於百分之 n
ff > 20 和 ff >= 20 Firefox 20 或者更新
none 消滅前綴

總結

autoprefixer 的精確度比 prefixr 好很多
速度飛快
默認配置夠用了，你的代碼要前綴就是為了最新的科技而寫的，不是為了支持 IE7 IE8 這些古董
PS: 寫 CSS 時，寫 W3C 官方的語法，這樣才插件才能自動幫你添加前綴。例如 linear-gradient，這個有 2008 年 Apple webkit 提案舊的語法，但是 autoprefixer 只看 W3C 的語法