本週，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 等）

有關這些功能的更多詳細資訊，請參閱 wiki 文件。

 

使用 Scripted 開發 Scripted

Scripted 100% 使用 JavaScript、HTML 和 CSS。因此，它是使用 Scripted 編輯器的完美程式碼庫。對於我們的其他工具專案，我們通常不會在日常工作中使用工具本身；相反，我們開發它們供他人使用。在 VMware，我們正在使用 Scripted 開發 Scripted——沒有什麼比開發人員自己不斷遇到錯誤更能更快地修復錯誤了！

 

Scripted 入門

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

但基本步驟如下

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

   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 解析器衍生版本進行處理。當開發人員積極編輯檔案時，程式碼通常處於未完成狀態，因此即使存在錯誤也能返回不錯的 AST 的可恢復解析器非常重要。

 

下一步是什麼？

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

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

 

我們決定儘早開源以獲取反饋。如果您想幫助我們塑造編輯器，請加入討論。有一個 scripted-dev google group 用於討論，以及一個 jira issuetracker 用於記錄錯誤、增強請求和對現有問題進行投票，以確保它們得到適當的優先順序。如果您想自己開始修改程式碼庫，我們絕對歡迎提交——請參閱 github 頁面瞭解更多資訊。

請嘗試一下！ https://github.com/scripted-editor/scripted