Slopographic

Slop Code 指南

Slop Code 入門

Slop Code 是 Slop Drive 檔案的程式碼編輯器。它可編輯 JavaScript、TypeScript、HTML、CSS、JSON、Markdown、Python 與純文字,並在沙箱預覽中執行 HTML 與 JavaScript。不會上傳任何內容。

開啟 Slop Code

建立或開啟檔案

「檔案總管」會顯示您 Slop Drive 的資料夾與檔案。「檔案」與「資料夾」按鈕會在所選資料夾中建立新項目。在列上按滑鼠右鍵,可選擇「重新命名」、「移到…」、「複製路徑」與「刪除」。「刪除」會將項目移到 Slop Drive 的垃圾桶。

  1. 點選「新增檔案…」(或頂端的「新增」)。
  2. 選擇「類型」,例如 HTML。它會設定副檔名與醒目提示。
  3. 輸入「名稱」並點選「建立」。檔案會在 Slop Drive 中建立,並在分頁中開啟。
  4. 若要編輯您已有的檔案,請點選「從 Slop Drive 開啟…」,或在左側的「檔案總管」中點選該檔案。
Slop Code 的「新增檔案」對話方塊,類型設為 HTML,名稱為 hello.html

編輯與儲存

編輯器具備行號、摺疊、括號比對、搜尋與取代,以及多個游標(Ctrl+點選可新增一個)。按 Ctrl+Space 可使用自動完成與程式碼片段。按 Enter 或 Tab 即可接受。

在您儲存前,編輯內容會以草稿形式保留在此裝置上。尚未儲存變更的分頁會以圓點標示。

  1. 按 Ctrl+S,或點選「儲存」,即可將檔案寫回同一個 Slop Drive 檔案。
  2. 點選「另存新檔」,即可將副本儲存到您選擇的資料夾。

執行頁面

預覽無法存取網路。頁面以相對路徑連結的 CSS、腳本與圖片,會從同一個 Slop Drive 資料夾取得。

  1. 開啟一個 HTML 或 JavaScript 檔案。
  2. 點選「執行」,或按 Ctrl+Enter。
  3. 右側會開啟「預覽」。主控台訊息與錯誤會顯示在其下方。點選「關閉」即可隱藏。
Slop Code 中開啟了 hello.html 於編輯器,預覽中執行其頁面,主控台顯示「Page ready」

擴充功能與其他檔案

「擴充功能」面板提供可開啟或關閉的內建輔助功能:「格式化工具」(格式化文件)、「語言模式切換器」與「程式碼片段」。這些功能不需要下載任何內容。

Markdown 檔案有「預覽」按鈕,可顯示轉譯後的內容。圖片、音訊、影片與 PDF 會在唯讀的檢視分頁中開啟。

提示: Ctrl+B 可顯示或隱藏側邊欄。點選「命令」即可搜尋所有指令。

鍵盤快速鍵

按鍵功能
Ctrl+O從 Slop Drive 開啟
Ctrl+Alt+N新增檔案
Ctrl+Alt+Shift+N新增資料夾
Ctrl+S儲存
Ctrl+Shift+S另存新檔
Ctrl+Alt+W關閉分頁
Ctrl+F / Ctrl+H尋找/取代
Ctrl+Space自動完成
Ctrl+Shift+F格式化文件
Ctrl+Alt+Z切換自動換行
Ctrl+B顯示或隱藏檔案總管
Ctrl+Enter執行預覽