Scripted 程式碼編輯器的第一個版本本週已在 github 上釋出：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 等）

這些功能的更多詳細資訊請參閱維基文件。

 

使用 Scripted 開發 Scripted

Scripted 是 100% 的 JavaScript、HTML 和 CSS。因此，它是一個完美的 codebase，可以在其上使用 Scripted 編輯器。對於我們的其他工具專案，我們通常不在日常工作中親自使用這些工具；相反，我們開發它們供其他人使用。在 VMware，我們正在使用 Scripted 開發 Scripted——沒有什麼比開發者自己不斷遇到 bug 修復得更快了！

 

Scripted 快速入門

github 登入頁面包含一個入門影片：

但基本步驟如下

1. 確保已安裝 node
2. 從此處獲取最新的打包版本 (0.2.0)：scripted_v0.2.0.zip 
3. 解壓
4. 確保 bin 資料夾中的指令碼是可執行的（如果在 linux/mac 上），使用命令chmod 755 bin/*
5. 將 bin 資料夾新增到你的 PATH

   Mac/Linuxexport PATH=<pathToUnzipLocationOrClone>/bin:$PATH

   Win

   set PATH=<pathToUnzipLocationOrClone>\bin;%PATH%  

6. 開始使用，像啟動 'vi' 一樣，用 'scr' 或 'scripted' 啟動它

   scr foo.js

Scripted 在啟動時會嘗試推斷您的專案根目錄。它透過搜尋附近的.git或.project檔案。如果沒有，它將以單檔案模式工作。要告訴 Scripted 根目錄在哪裡，您可以建立一個簡單的（空的）.scripted檔案放在根目錄下。Scripted 需要知道根目錄，因為當然，一些操作（如內容輔助、依賴解析、搜尋）是在專案上下文中發生的。  

技術棧

如前所述，伺服器端技術是 Node.js，但實際上伺服器端程式碼量非常小。支撐推斷引擎的是我們編寫的一些用於分析模組依賴關係的伺服器端 JS。

在客戶端方面，我們不想重複造輪子來實現編輯器技術，因此選擇了使用 Eclipse Orion 的編輯器。這提供了快速友好的編輯體驗，對於使用過“完整版 Eclipse” 編輯器的人來說會非常熟悉——它共享了許多相同的行為和快捷鍵繫結。我們盡力將我們在內容輔助等功能方面的工作貢獻回 Orion 專案。任何需要解析的 JavaScript 程式碼都會透過我們可恢復的 Esprima 解析器的衍生版本。當開發人員正在 actively 編輯檔案時，程式碼通常處於未完成狀態，因此一個即使在有錯誤時也能返回一個 decent 的 AST 的可恢復解析器非常重要。

 

接下來的計劃？

我們目前處於早期階段（0.2.0 版本），未來的計劃包括

• 更智慧的推斷，帶來更好的內容輔助和更輕鬆的導航。
• 側邊面板增加更多窗格。目前只有一個編輯器窗格，但我們打算加入搜尋結果窗格、文件、Git 資訊窗格，可能還有程式碼預覽和模擬程式碼執行窗格。目的是讓 Scripted 儘可能地自動管理這些窗格，以便螢幕上的所有內容都與當前任務相關。
• 簡單的外掛系統。
• 除錯。探索與 Chrome Dev Tools 和 node inspector 等工具的整合。

 

我們決定儘早開源以獲取反饋。如果您想幫助我們塑造這個編輯器，請加入討論。有一個 scripted-dev Google 群組用於討論，還有一個 jira 問題跟蹤器用於記錄錯誤、增強功能請求以及對現有問題進行投票，以確保它們得到適當的優先處理。如果您想親自修改 codebase，我們絕對歡迎提交——請檢視 github 頁面獲取更多資訊。

請試用！ https://github.com/scripted-editor/scripted