Compass建立者Chris Eppstein：真正的CSS框架是如何工作的（圖靈訪談）

Chris Eppstein，Compass框架的建立者，Sass核心團隊成員。Chris有10年以上為矽谷創業公司建立網站和應用程式的經驗，痴迷於前端開發。Chris曾是Caring.com的架構師，也是第一位員工，這個網站致力於服務老病人群的護理者。為了能夠用有限的經歷專心從事Sass和Compass的相關工作，Chris Eppstein離開了工作了6年的Caring.com，加入LinkedIn，從事前端架構和維護Sass & Compass的工作。這是他一直以來夢想的工作。Chris Eppstein著有《Sass與Compass實戰》。

Chris Eppstein（左）和前端開發者Liang-Bin Hsueh合影

問：你是如何開始對Sass感興趣又自創了Compass這個框架的?

當我在2007年發現Sass的時候，它還是版本1.8，而且是另一個開源專案Haml的一部分，它是為Ruby設計的HTML模板語言。雖然Haml也不錯，但是我發現Sass其實更具有革命性。Sass當時還沒有今天我們見到的眾多功能，但是對於我來說已經看到了希望：樣式表庫（經常被稱為CSS框架）可以像軟體庫那樣用適合的API來分發，而全然都沒有傳統CSS框架造成的問題。

Compass最開始的時候是Blueprint CSS架構對Sass的埠。我和Blueprint團隊溝通後，他們允許我提交一個補丁，這個補丁使用Sass作為源語言，建立CSS的分發。在那時，Blueprint是一個很成功的開源專案，所以在寫這個補丁的時候我花了很多精力。完成補丁的時候，我已經把這個專案中的每行程式碼都給換了。在這過程之中，我意識到我所創造的工具鏈是通用的，可以從這個特定的樣式表中分割開來。當我的補丁被Blueprint拒絕了之後，我想要指出一個方向：真正的CSS框架是如何工作的。所以我把我的專案稱為Compass（指南針），因為它指引了方向，而且聽起來和Sass類似。

問：加入LinkedIn的最大收穫是什麼？LinkedIn在Compass的開發方面有什麼幫助？

在加入LinkedIn之前，我的工作職務和家庭責任讓我幾乎沒有時間在開源軟體上工作。我已經精疲力竭，必須要停止某件事情，所以我放棄了開源軟體。但是，開源軟體是我的熱情所在，所以我開始尋找讓開源變成掙錢手段的方法。我考慮過諮詢，教學，而且我接觸了一些重要的公司，我認為他們有可能樂於看到Sass 和 Compass的開發進展更進一步。LinkedIn很熱情地接待了我，和他們的人會面之後，當我意識到他們對於支援開源軟體是多麼地熱忱，我就知道我找到家了。

每個在LinkedIn工作的人都可以把10%的工作時間花在業餘專案上，但是我可以花50%的工作時間在我覺得有意義的開源專案上。另50%的時間，我用在提高LinkedIn的靜態內容以及樣式表架構和工具上。

問：很多業界大牛都向Compass貢獻過程式碼，比如Eric Suzanne 和 Scott Davis。在專案之初，Compass是如何吸引這些人的注意力的？

是他們找到了我，在表明想要幫忙的來意之後，我歡迎了他們。當時我們並沒有因為任何東西而出名。我們被人所知全是因為後來我們一起努力所創造出的產品。

問：CSS有時會很脆弱，很多人擔心一旦他們開始嘗試CSS前處理器，會完全改變他們寫作和管理樣式表的方式。對於他們，你有什麼建議嗎？

CSS有時確實很脆弱，使用Sass則會讓你完全改變對於樣式表的看法。這是一件好事。但是既然SCSS語法是CSS的超集，你可以一點一點地用你自己的節奏慢慢接受每個功能。第一步就是要把所有的檔名的字尾由.css改成 .scss。祝賀你！現在你已經在寫sass了。現在你可以提取某些重複的值，把它們變成變數，這樣當你想改變的時候就會更加簡單。然後再創造一些mixin讓你的樣式表中的常見模式更容易維護，在你閱讀的時候還會標註出來。然後使用一些巢狀讓你更少重複，你的檔案也會更易讀。就是這麼簡單！

問：人們經常爭論Sass, LESS 和 Stylus哪個更好，你能向我們解釋一下它們各自都有哪些獨特的優勢嗎？

Sass毫無疑問是最好的樣式表處理器，對於大部分人來說都是明智的選擇。如果你選擇了LESS的話，可能是因為它上手更簡單，可以在你的瀏覽器裡執行。以JavaScript/Node.js為基礎的專案和LESS與Stylus整合起來更簡單，因為它們就是用javascript構建的。Stylus語言的目標使用者更多的是程式設計師，而LESS相比於Sass來說更傾向於描述，這樣設計是為了維護CSS描述性的本質。所有這些工具都會幫助你從簡單的CSS魔爪下逃離出來，讓你的生活更輕鬆。

問：隨著時間累積，Compass變得越來越大，你有沒有考慮在什麼時候對Compass做一下優化？

Compass從來不會強迫你在樣式表中放入任何你不想要的東西。既然如此，從Compass 1.0開始我們已經把Compass分成兩個專案，"CLI"是Compass的命令列介面（Command Line Interface），而"Core"全是樣式表和配置。核心庫可以在沒有 CLI 的情況下使用，這也讓它和其他以Sass為基礎的專案更好地互動，從而加入Compass的支援。最終，Compass的核心會和LibSass一起執行，LibSass是一個以C++為基礎的Sass實現，它執行起來非常地塊。

問：現在有很多優秀的Sass 和 Compass工具，你個人有什麼推薦嗎？

這個問題很難回答，因為有太多的好工具了。我認為你應該為你的工作選擇正確的工具。值得一提的是，Susy 2是一個很棒的網格系統，我認為這個工具很有創意，而且它的出現為Sass API的簡潔性和可組合性確立了一個新的標杆。

問：Compass的指定捐助物件為什麼是UMDF（聯合線粒體疾病基金會）？Compass是一個慈善共享軟體，有多少Compass相關工具幫助籌集資金？Compass已經幫助UMDF捐助了多少錢？

線粒體疾病是一種罕見的情況，多發於兒童，患病兒童大多數都無法活到成年。捐助的資金都用於治療和治癒的研究，以及對病人和其家人的支援。發起這項捐助有我的個人原因在裡面，我的父親在1992年被確診為患有一種罕見的成年人形式的線粒體疾病。

據我現在所知，Compass.app已經捐助了他們一部分的利潤。其他的22,000美元都是從社群捐贈而來。小善舉也會讓愛心匯聚！

問：你曾和很多創業公司有過密切接觸，對於急於成功的創業者們你有沒有什麼建議？

有一些。找工作要找你喜歡的，並且周圍都是你願意與之共事的同事。不要以低於市場價值的薪酬工作，不管他們承諾給你多少的股權。不要工作到忘了那些在你生命中真正重要的人，為他們留出足夠的時間。如果你擁有了這些，無論你的創業事業發展如何，你都是成功的。

從另一方面來說，對於任何工作或產品，我認為核心技能就是在洗耳傾聽和冷靜判斷之間找到一個平衡，你應該具有相應的品味和眼界來判斷什麼主張可以讓你更接近目標，而什麼主張會讓你從接近目標的航線上偏離開來，要對使你偏離的主意說不。Sass正是一個經歷瞭如此過程的產品。我們知道我們想要這個語言做到什麼，但是我們也會仔細傾聽社群和使用者們的建議，他們會指引我們做出對他們來說更有用的產品。

感謝所有閱讀這篇訪談的讀者，我希望你們也會喜歡我的書《Sass與Compass實戰》！我喜歡為你們開發Sass & Compass，衷心希望你們喜歡使用這個工具。

---

更多精彩，加入圖靈訪談微信！