skill 的自動調適能力

這份教學要示範的是 skill 的自動調適能力：原本為「每題一張圖片＋JSON 答案檔」題組設計的自主測驗 Skill，遇到一份把所有題目放在單一 Markdown 檔案中的新題庫格式時，會自己先辨識資料格式、調整處理方式，仍然產生學生可用的自主測驗網頁——不需要你事先告訴它格式不一樣。這份 Markdown 題庫中的每一題是一段程式碼、六個選項 A～F，加上一行標準答案；產生的網頁可直接雙擊開啟，不需要架站或連網，題目與選項中的程式碼也會依語言自動上色、可正常選取複製。全程不需要自己寫程式，只要用一般白話文和程式開發用的 AI 助理（例如 Claude Code、Codex 或其他類似工具）對話即可。

本教學以「專案根目錄」為基準：題庫原始檔放在專案根目錄下的 repo/ 資料夾，AI 助理產生出來的網頁與工具則放在專案根目錄下的 app/ 資料夾。如果你實際的資料夾安排不一樣（例如題庫放在別的位置），把下面提示語裡的路徑換成你自己的即可，整個流程的邏輯不會改變。

因為題目本身就是純文字加程式碼，不是圖片，產生出來的檔案通常只有幾十 KB，比題目全部靠內嵌圖片組成的測驗檔小非常多。

學習目標

做完這份教學，你應該能夠：

• 遇到「手上的工具好像不太合用」的情況時，知道可以用一句話請 AI 助理自己判斷、自己決定要不要另外寫一支小工具，而不是勉強把資料塞進不合適的既有工具。
• 不用自己懂 Markdown 怎麼解析、語法上色怎麼寫，只靠幾句自然語言，把純文字題庫變成雙擊即用、程式碼還會依語言上色的自我測驗網頁。
• 知道之後每多一份新題庫，只要一句「重新掃描」，就能讓 AI 助理自動抓出格式上的小差異並修好，不用每次重講一次規則。
• 知道怎麼查看、彙整所有作答者的成績。

先備條件

• 手上已經有一份「文字檔就是一整份題庫」的素材：每一題是一段程式碼、六個選項 A～F、外加一行標準答案，全部寫在同一份 Markdown 文字檔裡。
• 已經能開啟並使用一套程式開發用的 AI 助理工具（例如 Claude Code、Codex，或類似的 AI 編碼助手），並且已經打開你的專案資料夾。
• 不需要會寫程式、不需要另外安裝任何套件、也不需要自己開終端機——全程只要在 AI 助理的對話視窗打字，它會視需要自己執行寫好的程式。

不需要在提示語裡先講清楚要套用哪一個工具。AI 助理會自己先看看有沒有現成的工具，判斷合不合用，再決定要不要另外寫一支專屬的小工具。之後要新增題庫，也只要請它「重新掃描」，不用重講一次規則。

一句話請 AI 想辦法

把「找有沒有現成工具、判斷合不合用、真的動手做出來、放在哪裡」整段判斷都交給一句話：

用本地端的 skill 做一個自主練習用的試卷App，題目參考 @repo，App放在專案根目錄的 app/ 資料夾

（如果你的介面支援用 @ 快速標記檔案或資料夾，直接打 @repo 即可；沒有這個功能的話，把完整路徑打出來效果一樣。）

AI 助理看過 repo/ 之後，會發現裡面是純文字的 Markdown（題目、程式碼、六個選項都寫在文字檔裡），跟一般「每題一張圖片＋JSON 答案檔」的現成工具預期的格式不一樣。這時候不需要你多做任何補充，AI 助理會自己判斷：不勉強套用不合用的工具，改成另外寫一支小工具——一支負責把 Markdown 解析成題目資料的程式，加上一份負責顯示題目、作答、算分、匯出成績單的網頁樣板。做完之後會照你講的位置，收進 app/：解析完的題目資料放進 app/ 底下的子資料夾，雙擊即用的成品輸出到 app/dist/，一份題庫對應一個檔案。

驗收重點

• app/dist/ 底下應該出現一個或多個 *_quiz.html 檔案，大小大約幾十 KB（題目是文字不是圖片，檔案本來就會小很多）。
• 直接雙擊打開任一個檔案，不要另外開伺服器；輸入姓名、選一個較小的題數、作答幾題、按送出，確認會出現分數跟逐題對錯畫面，而且題目裡的程式碼有依語言上色。
• 確認程式碼區塊裡的文字可以用滑鼠選取、複製，而不是一張圖片。

成績彙整

學生（或任何作答者）在測驗頁面送出作答後，畫面上有一顆「下載成績單 (CSV)」按鈕，會把這次作答的逐題結果存成一個 CSV 檔。app/ 底下會有一份彙整工具，一樣雙擊即可開啟，不需要架站、不會把資料上傳到網路上。把收到的 CSV 檔拖曳到頁面上的拖放區，就會自動彙整出每位作答者的成績、跟每一題整體的答對率。

題庫更新了，一句話重新掃描

過幾天題庫資料夾裡多了新的 Markdown 檔，不用重新解釋一次規則，一句很短的話就夠：

掃描並更新新加入的題庫

這句話讓 AI 助理自己去比對 repo/ 跟已經處理過的紀錄，找出新加入的題庫檔案，接著套用原本那支解析程式。如果新檔案的格式跟舊的有一點點不一樣（例如分隔線多了一個空格、或有些題目完全沒放程式碼區塊），原本那支程式可能會解析失敗或解析錯位置。AI 助理不會要你自己動手修，而是直接把那支共用的解析程式改得更寬容，讓新舊題庫都能正確解析，再重新產生全部的雙擊檔案。

這正是「重新掃描」這句話的價值：你不需要事先知道新題庫的格式有什麼細微差異，AI 助理會在真正解析失敗的時候才發現問題、自己修好解析規則，而不是要你先讀懂所有題庫的格式規則才能開口。

重新掃描新題庫

這句話也可以在確認沒有新問題時單純用來重新產生一次全部檔案。之後每多一份新題庫，重複打這句一模一樣的話就好。

一句話升級成語法上色

題庫都能用了之後，畫面上的程式碼原本可能只是純黑白等寬字型，用一句話請它加上顏色：

幫測驗App的程式碼加上語法上色，既有的網頁檔案跟相關工具都要一起更新

這裡的「相關 skill」指的是專案裡那支自己寫的小工具（解析程式加網頁樣板），不是外部通用、給其他專案共用的正式 skill——這一點 AI 助理在動手前會自己判斷清楚，不用你特別指名。AI 助理實際做的事情包括：讓解析程式額外記住每段程式碼原本標記的語言（例如 Python 或 JavaScript），並在網頁樣板裡加一小段不需要外部套件、也不用連網路的上色邏輯——關鍵字、字串、數字、註解、布林值／None／null、常見內建函式各自套用不同顏色，然後把所有題庫全部重新產生一次。

改完之後，雙擊開啟的檔案還是一樣不需要伺服器、不需要網路（上色邏輯就寫在檔案裡面，不是連到網路上的服務），只是題目跟選項裡的程式碼變得跟平常看到的程式編輯器一樣容易閱讀，而且在作答完看答案的畫面裡，上色效果也會一起保留。

再修一次：換一套語法上色配色

語法上色做出來之後，如果只是想換顏色（不是改解析邏輯），可以再用一句話請它調整：

語法上色換一套顏色，想要類似 Dracula 編輯器主題的深紫色系

因為前一步已經把六種顏色（註解、字串、數字、關鍵字、布林常數、內建函式）各自寫成獨立的樣式規則，這次 AI 助理不需要重寫上色邏輯，只要把對應的顏色數值換掉，再把所有題庫重新產生一次，新配色就會套用到每一份雙擊檔案。

如果不確定要哪一套顏色，也可以先請它列出兩三種常見的深色系配色讓你比較，你確認要哪一種之後再請它套用到全部題庫；跟改解析規則比起來，改配色屬於單純的外觀調整，來回會快很多。

定案後，存回 skill 本身

到目前為止，換配色這件事只改到「這個專案」產生出來的網頁。因為一開始是請 AI 助理用本地端的 skill 做出這個測驗 App，實際被拿來配色的規則，是寫在 skill 本身的樣板檔案裡，剛剛的調整目前只套用到這次跑出來的結果，還沒有回寫進 skill。也就是說，如果之後拿同一個 skill 去別的專案、或別份題庫重新建立測驗 App，產生出來的還是原本的配色，不會自動帶著這次改好的深紫色系——除非再把同一句話講一次。

確認這次的配色就是你要的之後，用一句話請 AI 助理把這個改動「升級」成 skill 的預設值：

把剛剛的所有更動調整同步更新回本地端對應的 skill

AI 助理會去找出 skill 定義本身放樣板、放規則的檔案，把剛剛調整過的顏色數值同步寫進去，而不是只留在這次產生出來的 app/ 底下。這麼一來，這次的修正就從「這個專案的一次性調整」變成「skill 的新預設值」：以後不管是同一個專案新增題庫，還是拿去別的專案重新建立測驗 App，一開始產生出來的就已經是這套配色，不用每次都重新講一次要換顏色。

這一步只在你確定滿意、不會再改的時候才做。如果還在比較配色、還沒定案，先照上一節的做法在單一專案裡試就好，等真的定案了再用這句話收尾，把改動存回 skill；之後如果又想換另一套顏色，一樣是先試、確定了再存回去。