本週已在 github 上發布 Scripted 程式碼編輯器的第一個版本:https://github.com/scripted-editor/scripted。
雖然 Scripted 是一款通用程式碼編輯器,但最初的重點是建立出色的 JavaScript 編輯體驗。 Scripted 本身完全使用 JavaScript 和 HTML/CSS 建構。 它是一個基於瀏覽器的編輯器,在開發人員的機器上本機執行,並使用 Node.js 實例來提供編輯器程式碼並執行編輯器操作。 執行 Scripted 的唯一先決條件是您已安裝最新版本的 Node.js(我們目前正在使用 Node 0.8.11 進行測試)。 Scripted 重用了 Eclipse Orion 中的編輯器元件。
Scripted 實際操作
為何建立 Scripted?
Scripted 是內部原型設計和調查工作探索未來工具不同策略的結果。 探索這個領域的主要因素實際上是雙重的
首先,我們看到許多使用者選擇不使用 IDE,而是選擇更簡單的輕量級編輯器(vim、Sublime、textmate)。 開發人員通常有一組非常熟悉的工具來處理常見任務(例如命令列 git),並且不覺得需要透過其他使用者介面來學習如何使用這些工具。 這些開發人員希望工具幾乎可以立即啟動,並在操作過程中保持極高的反應速度。 然而,目前,當選擇放棄 IDE 時,他們似乎也放棄了他們已經習慣的優點,例如出色的內容輔助、快速導航和早期錯誤指示。 Scripted 提供輕量且快速的東西,也支援開發人員不可或缺的關鍵 IDE 功能 - 諸如內容輔助和理解常見模組系統等功能。 這些是 Scripted 的主要重點。
其次,我們看到雲端 IDE 和雲端工作區的概念越來越受歡迎。 開發人員連線到某些遠端系統來完成他們的開發工作,並且通常這些工具(例如 Cloud9 IDE 和 eXo Cloud IDE)提供基於瀏覽器的編輯體驗。 使用者的工作區位於遠端系統上。 這種設定對於某些團隊來說可能運作良好,但在我們的經驗中,我們發現仍然需要一些離線開發模式,因為開發人員尚未 100% 連線到網際網路,並且也很難讓他們放棄「完全控制」並遠端託管他們的文件。 透過遵循基於瀏覽器的編輯模型並在本機託管伺服器,Scripted 提供了一種可以滿足當前開發人員需求的解決方案,而且將來只需遠端部署伺服器即可啟用雲端工作區的使用。
從根本上來說,我們覺得許多現有的 JavaScript 工具在某些關鍵領域有所欠缺,並且鑑於我們在語言工具方面的背景,我們想看看是否可以建構一個輕量級工具來解決這些需求。
專注於 JavaScript
JavaScript 的受歡迎程度持續增加。 不再僅適用於用戶端程式設計,諸如 Node.js 之類的框架使其可用於完整的端對端解決方案。 這就是我們選擇將 JavaScript 作為 Scripted 的首要任務的原因。 當然,我們也對相關語言(例如 CoffeeScript、最近發布的 TypeScript)感興趣,但目前共同點是 JavaScript。 我們希望為一種語言建立出色的體驗,而不是為多種語言建立不太出色的體驗。
功能集
- 快速啟動、輕量級。
- JavaScript、HTML 和 CSS 的語法突顯。
- 錯誤和警告
- 整合了 JSLint 以在 JavaScript 程式碼上提供錯誤/警告標記。
- AMD 和 CommonJS 模組解析:存在基本的解析,其中未解析的參考將被標記為錯誤。
- 內容輔助
- HTML、CSS 的基本內容輔助
- 對於 JavaScript,內容輔助由型別推斷引擎驅動,該引擎知道 AMD/CommonJS 模組依賴性,並且還使用 JSDoc 註解來幫助它理解程式碼。
- 懸停:將滑鼠懸停在 JavaScript 識別碼上會顯示推斷的型別簽名。
- 導航:在識別碼(推斷器已識別)上按下 F8,編輯器將導航到宣告。 這也適用於模組識別碼(例如在 define() 子句中)
- 格式化:整合了 JSbeautify
- 側邊欄:除了主編輯器之外,還可以開啟一個側邊欄 - 目前這可以用於託管第二個編輯器。
- 外部命令的按鍵綁定:編輯器中的按鍵綁定可以調用外部命令(less、mvn 等)
在
wiki 文件中,有關於這些功能的更多詳細資訊。
使用 Scripted 開發 Scripted
Scripted 是 100% JavaScript、HTML 和 CSS。 因此,它是使用 Scripted 編輯器的完美程式碼庫。 對於我們的其他工具專案,我們通常不會在日常工作中使用這些工具本身; 而是我們開發它們供他人使用。 在 VMware,我們正在使用 Scripted 開發 Scripted - 沒有什麼比開發人員自己不斷遇到它們更能更快地修復錯誤了!
Scripted 入門
github 登陸頁面包含一個入門影片:

但基本步驟如下
- 確保您已安裝 node
- 從這裡取得最新的封裝版本 (0.2.0):scripted_v0.2.0.zip
- 解壓縮
- 確保 bin 資料夾中的指令碼是可執行的(如果在 linux/mac 上)chmod 755 bin/*
- 將 bin 資料夾新增到您的路徑
Mac/Linuxexport PATH=<pathToUnzipLocationOrClone>/bin:$PATH
Win
set PATH=<pathToUnzipLocationOrClone>\bin;%PATH%
- 開始使用它,像啟動 'vi' 一樣啟動它,使用 'scr' 或 'scripted'
scr foo.js
Scripted 將嘗試在啟動時推斷您的專案根目錄。 它會透過搜尋接近的目錄來完成此操作
.git或
.project在層次結構中建立檔案。 如果您沒有任何檔案,它將在單一檔案模式下運作。 若要告訴 Scripted 根目錄在哪裡,您可以建立一個簡單的(空的)
.scripted位於根目錄中的檔案。 Scripted 需要知道根目錄,因為當然,某些操作(例如內容輔助、依賴性解析、搜尋)會在專案的上下文中發生。
技術
如前所述,伺服器端技術是 Node.js,但它實際上是非常少量的伺服器程式碼。 支援推斷引擎的是我們為分析模組依賴性而編寫的一些伺服器端 JS。
在用戶端,我們不想重新發明編輯器技術,因此選擇使用 Eclipse Orion 中的編輯器。 這提供了一種出色的快速編輯體驗,對於任何使用過「完整 eclipse」中的編輯器的人來說都非常熟悉 - 它們具有許多相同的行為和按鍵綁定。 在可能的情況下,我們在諸如內容輔助之類的功能上所做的工作正在貢獻回 Orion 專案。 任何需要解析的 JavaScript 都會透過我們可恢復的 Esprima 解析器的衍生版本傳遞。 當開發人員主動編輯檔案時,程式碼通常處於未完成的狀態,因此即使存在錯誤也能傳回體面的 AST 的可恢復解析器非常重要。
下一步?
我們目前處於早期階段(0.2.0 版),我們未來的計畫包括
- 更聰明的推斷,從而帶來更好的內容輔助和更輕鬆的導航。
- 側邊欄的更多窗格。 目前只有一個編輯器窗格,但我們打算包含搜尋結果窗格、文件、git 資訊窗格,也許是程式碼預覽和模擬程式碼執行窗格。 其意圖是讓 Scripted 盡可能自動管理這些窗格,以便螢幕上的所有內容都與手頭的任務相關。
- 簡單的插件系統。
- 除錯。 探索與諸如 Chrome 開發人員工具和 node inspector 之類的工具的整合。
我們決定盡早開放原始碼以獲得回饋。 如果您想幫助我們塑造編輯器,請加入討論。 有一個 scripted-dev google 群組用於討論它,還有一個 jira 問題追蹤器用於記錄錯誤、增強請求以及投票表決現有問題,以確保它們被適當地優先排序。 如果您想自己開始破解程式碼庫,我們絕對樂於接受提交 - 請參閱 github 頁面以取得更多資訊。
請試用它! https://github.com/scripted-editor/scripted