[{"data":1,"prerenderedAt":1198},["ShallowReactive",2],{"search-dialog-posts":3,"post-\u002Fposts\u002Fclaude-codex-skills":316,"post-surround-\u002Fposts\u002Fclaude-codex-skills":1191},[4,12,21,29,37,47,57,67,77,85,96,104,112,121,129,137,147,155,164,173,181,188,195,207,215,224,236,241,247,254,260,266,272,279,286,291,298,304,310],{"path":5,"title":6,"description":7,"category":8,"tags":9},"\u002Fposts\u002Fgit-commands-cheatsheet","Git 常用指令與終端機筆記","2018 年整理的 Git 學習筆記，包含基本終端機指令、Git 操作、分支、reset、SourceTree、Vim 與一些常用設定。","notes",[10,11],"Git","版本控制",{"path":13,"title":14,"description":15,"category":16,"tags":17},"\u002Fposts\u002Fjs-prototype-inheritance","JavaScript 物件導向：建構函式、prototype 與繼承三步驟","整理 ES5 時代用建構函式加 prototype 手刻物件導向的完整流程——封裝屬性與方法、共用函式為什麼要掛在 prototype 上、以及繼承的三個步驟（call 借用母類別建構子、Object.create 接上原型鏈、修正 constructor 指向），並附上物件縮寫與計算屬性這兩個順便學到的 ES6 寫法。","frontend",[18,19,20],"JavaScript","物件導向","prototype",{"path":22,"title":23,"description":24,"category":16,"tags":25},"\u002Fposts\u002Fflexbox-notes","Flexbox 對齊與彈性尺寸筆記","記錄 Flexbox 的主軸與交錯軸對齊、flex-direction、flex-wrap，以及 flex-grow、flex-shrink、flex-basis 等常用屬性。",[26,27,28],"CSS","Flexbox","版面",{"path":30,"title":31,"description":32,"category":16,"tags":33},"\u002Fposts\u002Fscreen-orientation-api","screen.orientation：現在判斷與鎖定螢幕方向的做法","整理現在 JavaScript 判斷螢幕方向的方式，包括 screen.orientation、change 事件與 lock()，並說明 RWD 使用 matchMedia 或 CSS orientation 會更適合。",[18,34,35,36],"RWD","螢幕方向","PWA",{"path":38,"title":39,"description":40,"category":16,"tags":41},"\u002Fposts\u002Fpinia-vuex-state-management","Pinia \u002F Vuex 狀態管理及差異","紀錄 Vuex、Pinia 的狀態管理概念、差異與用法。",[42,43,44,45,46],"Pinia","Vuex","Vue3","狀態管理","Nuxt",{"path":48,"title":49,"description":50,"category":8,"tags":51},"\u002Fposts\u002Fpyenv-python-version-management","Python 多版本管理 pyenv","紀錄 macOS 與 Windows 使用 pyenv 管理 Python 版本的方式。",[52,53,54,55,56],"Python","pyenv","macOS","Windows","版本管理",{"path":58,"title":59,"description":60,"category":8,"tags":61},"\u002Fposts\u002Fnpm-publish-vue2-component","npm 發布流程","紀錄 Vue 2 元件的 npm 發布、dist-tag 與打包流程。",[62,63,64,65,66],"npm","Vue2","Vue CLI","套件發布","MIT",{"path":68,"title":69,"description":70,"category":8,"tags":71},"\u002Fposts\u002Fmobile-debugging-today","現在怎麼 debug 手機網頁：從裝一堆工具到幾乎不用裝","對照 2022 年那套 scoop、iTunes、remotedebug-ios-webkit-adapter 的繁瑣設定，整理現在偵錯手機網頁的做法：Android 無線偵錯、iOS 的實際選項、on-device console、Playwright 裝置模擬，以及本機 HTTPS 的處理。",[72,73,74,75,76],"debug","iOS","Android","Chrome DevTools","Playwright",{"path":78,"title":79,"description":80,"category":16,"tags":81},"\u002Fposts\u002Fplaywright-vs-cypress","E2E 測試現在選什麼：Playwright 與 Cypress 的實際差異","對照幾年前用 Cypress 的做法，說明 Playwright 為什麼變成多數新專案的預設選擇：真正的多瀏覽器支援、免費的平行執行、trace viewer 除錯，以及兩者在架構上的根本差異與各自仍然適合的場景。",[76,82,83,84],"Cypress","E2E","測試",{"path":86,"title":87,"description":88,"category":89,"tags":90},"\u002Fposts\u002Fjs-encoding-today","現在處理編碼：TextEncoder、Uint8Array 的 Base64 方法與 URLSearchParams","整理 JavaScript 現代編碼方式，使用 TextEncoder、TextDecoder 與 Uint8Array 處理 UTF-8 與 Base64，並說明 Base64URL、URLSearchParams 與 encodeURIComponent 的差異。","research",[91,92,93,94,95,18],"編碼","TextEncoder","Base64","URLSearchParams","Uint8Array",{"path":97,"title":98,"description":99,"category":16,"tags":100},"\u002Fposts\u002Fdart-sass-migration","Dart Sass 遷移筆記：node-sass 之後怎麼裝 Sass","node-sass 與 LibSass 已停止維護，現在改用 Dart Sass。整理 webpack 與 Vite 的安裝方式，以及為什麼不再像 node-sass 一樣容易遇到 Node.js 版本與原生編譯問題。",[101,102,103],"Sass","Webpack","Vite",{"path":105,"title":106,"description":107,"category":16,"tags":108},"\u002Fposts\u002Fdayjs-vue3-computed","day.js 搭配 Vue 3 的日期格式化","整理 Vue 3 日期格式化的常見做法，使用 day.js 取代舊專案常見的 moment.js，並以 method 或 computed 取代 Vue 2 filter，也補充原生 Intl.DateTimeFormat 的使用方式。",[44,109,110,111],"day.js","日期","Intl",{"path":113,"title":114,"description":115,"category":16,"tags":116},"\u002Fposts\u002Fes-modules-today","ES Module 現在的樣子：Node ESM、exports 與 import maps","整理現代 JavaScript ES Module 的常見用法，包括 Node.js 原生 ESM、package.json exports、瀏覽器 import maps、JSON import attributes，以及 Vite 動態載入的注意事項。",[117,118,119,120,103,18],"ES Module","Node.js","import maps","exports",{"path":122,"title":123,"description":124,"category":89,"tags":125},"\u002Fposts\u002Fstructured-clone","structuredClone()：終於有內建的深層拷貝","整理 JavaScript structuredClone() 的深層拷貝用法，說明 Date、Map、Set、循環參考的處理方式，以及 Function、class 與 Vue reactive Proxy 的注意事項。",[18,126,127,128],"structuredClone","深拷貝","Vue",{"path":130,"title":131,"description":132,"category":16,"tags":133},"\u002Fposts\u002Fdynamic-import","JavaScript 動態載入：import() 與 Vue 非同步元件","整理靜態 import、動態 import() 與 Vue defineAsyncComponent 的使用方式，並簡單補充 Vite import.meta.glob 的用途。",[18,134,135,103,136],"ES Modules","Vue 3","Code Splitting",{"path":138,"title":139,"description":140,"category":16,"tags":141},"\u002Fposts\u002Fscreen-wake-lock-api","Screen Wake Lock API：不用套件也能讓頁面保持亮著","整理 Screen Wake Lock API 的基本用法，說明 HTTPS、頁面可見性、切換分頁後重新取得 wake lock，以及 Vue／Nuxt 計時器使用時的注意事項。",[142,128,143,144,145,146],"Wake Lock","Nuxt4","行動裝置","計時器","Web API",{"path":148,"title":149,"description":150,"category":16,"tags":151},"\u002Fposts\u002Fhtml-meta-boilerplate-today","現在的 HTML meta 標籤怎麼寫","整理現在一個新頁面該有的 meta 標籤骨架——viewport 補上 viewport-fit=cover 因應瀏海與圓角螢幕、color-scheme 讓表單控制項跟著深色模式換色、theme-color 決定行動瀏覽器工具列顏色，以及基本的 SEO 與 Open Graph 標籤。",[152,153,154],"HTML","meta","SEO",{"path":156,"title":157,"description":158,"category":8,"tags":159},"\u002Fposts\u002Fdocker-node-postgres","把 Node + PostgreSQL 的 backend 裝進 Docker：Dockerfile、.dockerignore 與 compose","從「本機裝了就跑」到打包成容器的通用做法——Dockerfile 每一行的理由與 layer cache 為什麼決定了指令順序、.dockerignore 漏掉 node_modules 對原生模組是災難級的問題、容器之間為什麼不能用 localhost 互相找到對方，以及怎麼驗證資料真的寫進了 volume。",[160,161,118,162,163],"Docker","Docker Compose","PostgreSQL","Express",{"path":165,"title":166,"description":167,"category":16,"tags":168},"\u002Fposts\u002Fnuxt-server-proxy","Nuxt 3 \u002F 4 用 Server API 做代理與轉發","整理 Nuxt 3 與 Nuxt 4 使用 server\u002Fapi 轉發第三方 API 的方式，可以避免瀏覽器 CORS 問題、隱藏 API Key，也能在伺服器端加入快取。",[169,143,170,171,172],"Nuxt3","CORS","Nitro","API",{"path":174,"title":175,"description":176,"category":16,"tags":177},"\u002Fposts\u002Fnuxt4-project-setup","Nuxt 4 建立專案：和 Nuxt 3 有哪些不同","整理 Nuxt 4 建立專案的基本流程與目錄結構，並對照 Nuxt 3 的差異，包括 app\u002F 目錄、路徑別名、TypeScript，以及目前常用的 ESLint 與 Tailwind CSS 4 設定。",[143,44,178,179,180],"TypeScript","ESLint","Tailwind CSS 4",{"path":182,"title":183,"description":184,"category":16,"tags":185},"\u002Fposts\u002Fnuxt3-route-middleware","Nuxt 3 \u002F 4 的 Route Middleware：進頁面前先做判斷","整理 Nuxt 3 與 Nuxt 4 的 Route Middleware，用 defineNuxtRouteMiddleware 在進入頁面前檢查登入狀態，搭配 navigateTo 重新導向，並說明一般 middleware、global middleware 與 definePageMeta 的用法。",[169,143,186,187],"Middleware","驗證",{"path":189,"title":190,"description":191,"category":16,"tags":192},"\u002Fposts\u002Fnuxt-route-rules-redirect","Nuxt 3 \u002F 4 的 routeRules：重新導向與頁面設定","整理 Nuxt 3 與 Nuxt 4 的 routeRules 用法，可以依照不同網址設定重新導向、預渲染、SSR 與快取，並簡單對照 Nuxt 2 的舊做法。",[169,143,193,194],"routeRules","重新導向",{"path":196,"title":197,"description":198,"category":16,"tags":199},"\u002Fposts\u002Fios-iframe-google-login-blank-page","iOS iframe 串接 Google 登入出現空白頁：Popup 與頁面回收問題排查紀錄","記錄 iframe 內串接 Google 第三方登入時，部分 iOS 裝置因背景頁面遭到回收並重新載入，導致 Popup 登入流程中斷，以及最後透過 Redirect 分流與登入狀態接回機制處理的過程。",[73,200,201,202,203,204,205,206],"Safari","iframe","Google Login","GIS","OAuth","Popup","Redirect",{"path":208,"title":209,"description":210,"category":16,"tags":211},"\u002Fposts\u002Fios-login-tab-return-behavior","iOS 第三方登入後回不到原頁？分頁開啟關係與回頁行為實測","記錄 iOS Safari 與 Chrome 在多分頁第三方登入流程中，登入頁關閉後不一定回到原頁的實測，以及分頁開啟關係、window.close 與 window.focus 的限制。",[73,200,212,202,204,201,213,214],"Chrome","window.close","window.focus",{"path":216,"title":217,"description":218,"category":16,"tags":219},"\u002Fposts\u002Fgoogle-app-about-blank-placeholder","Google App 內建瀏覽器：about:blank 佔位頁被關閉的排查紀錄","記錄 iOS Google App 內建瀏覽器在非同步開啟外部頁面時，about:blank 佔位分頁被自動關閉，導致第三方登入或外部導轉失敗的排查與解法。",[73,220,221,222,204,223],"Google App","window.open","about:blank","WebView",{"path":225,"title":226,"description":227,"category":228,"tags":229},"\u002Fposts\u002Fclaude-code-codex-cli-init-basics","AI 相關紀錄 v1｜Claude Code \u002F Codex CLI 初始化與基本概念","從 Claude Code 與 Codex CLI 開始，整理 CLI、Coding Agent、Context、\u002Finit 與 CLAUDE.md／AGENTS.md 這幾個一開始最容易搞混的概念，以及在既有專案中的安裝與啟動方式。","ai",[230,231,232,233,234,235],"AI","Claude Code","Codex CLI","Coding Agent","CLAUDE.md","AGENTS.md",{"path":237,"title":238,"description":239,"category":228,"tags":240},"\u002Fposts\u002Fclaude-agents-md-project-guidelines","AI 相關紀錄 v2｜CLAUDE.md \u002F AGENTS.md 怎麼寫？專案規範與實際範例","整理 CLAUDE.md 與 AGENTS.md 的用途、適合記錄的專案規範，以及可直接參考的設定範例。",[230,231,232,234,235],{"path":242,"title":243,"description":244,"category":228,"tags":245},"\u002Fposts\u002Fclaude-codex-config-locations","AI 相關紀錄 v3｜Claude Code `.claude\u002F` \u002F Codex CLI 設定位置：全域與專案設定基本概要介紹","整理 Claude Code 與 Codex CLI 的使用者層級、專案層級設定位置，以及 rules、skills、agents 等目錄的用途。",[230,231,232,246],"設定檔",{"path":248,"title":249,"description":250,"category":228,"tags":251},"\u002Fposts\u002Fclaude-settings-codex-config","AI 相關紀錄 v4｜Claude Code settings \u002F Codex config 基本設定","整理 Claude Code settings.json 與 Codex config.toml 的設定層級、權限控制和常見基本設定。",[230,231,232,252,253],"settings.json","config.toml",{"path":255,"title":256,"description":257,"category":228,"tags":258},"\u002Fposts\u002Fclaude-codex-rules-structure","AI 相關紀錄 v5｜Rules：專案規則多了之後怎麼拆？","整理 Claude Code Rules 與 Codex AGENTS.md 的拆分方式，說明何時該拆、怎麼依目錄管理專案規則。",[230,231,232,259,235],"Rules",{"path":261,"title":262,"description":263,"category":228,"tags":264},"\u002Fposts\u002Fclaude-codex-slash-commands","AI 相關紀錄 v6｜Commands \u002F Slash Commands：CLI 裡的 `\u002F` 指令是什麼？","介紹 Claude Code 與 Codex CLI 的 Slash Commands，整理常用內建指令、自訂指令與 Skills 的差異。",[230,231,232,265],"Slash Commands",{"path":267,"title":268,"description":269,"category":228,"tags":270},"\u002Fposts\u002Fclaude-codex-skills","AI 相關紀錄 v7｜Skills：把重複工作流程整理起來","介紹 Claude Code 與 Codex Skills，整理適合保存成 Skill 的重複流程、基本結構與使用方式。",[230,231,232,271],"Skills",{"path":273,"title":274,"description":275,"category":228,"tags":276},"\u002Fposts\u002Fclaude-codex-agents-subagents","AI 相關紀錄 v8｜Agent \u002F Subagent：什麼時候真的需要分工？","整理 Agent、Subagent 與 Custom Agent 的用途，說明何時適合分工，以及它們和 Rules、Skills 的差異。",[230,231,232,277,278],"Agent","Subagent",{"path":280,"title":281,"description":282,"category":228,"tags":283},"\u002Fposts\u002Fmcp-basics","AI 相關紀錄 v9｜MCP：讓 AI 使用其他工具與資料","介紹 MCP 如何讓 AI 使用外部工具與資料，並以 Pencil MCP 說明實際用途、權限風險及與 Skill 的差異。",[230,284,231,232,285],"MCP","Pencil",{"path":287,"title":288,"description":289,"category":228,"tags":290},"\u002Fposts\u002Fai-coding-agent-concepts-summary","AI 相關紀錄 v10｜基本概念小結論","用一篇快速整理 CLAUDE.md、AGENTS.md、設定檔、Rules、Commands、Skills、Agent 與 MCP 的角色和差異。",[230,231,232,284,271,277],{"path":292,"title":293,"description":294,"category":228,"tags":295},"\u002Fposts\u002Fclaude-code-codex-model-selection","Claude Code 與 Codex：不同模型怎麼選？","比較 Claude Code 與 Codex 不同模型的速度、能力與成本取捨，依工作難度整理實用的選擇方向。",[230,231,296,297],"Codex","模型選擇",{"path":299,"title":300,"description":301,"category":228,"tags":302},"\u002Fposts\u002Fclaude-model-selection","Claude 模型簡單怎麼選？","整理 Claude 各模型在速度、能力與使用情境上的差異，提供從輕量工作到複雜任務的選擇方向。",[230,231,303,297],"Claude",{"path":305,"title":306,"description":307,"category":228,"tags":308},"\u002Fposts\u002Fcodex-model-selection","Codex 模型簡單怎麼選？","整理 Codex 各模型在速度、能力與使用情境上的差異，提供從簡單修改到大型端到端任務的選擇方向。",[230,296,309,297],"OpenAI",{"path":311,"title":312,"description":313,"category":228,"tags":314},"\u002Fposts\u002Fclaude-code-codex-cli-command-cheatsheet","Claude Code \u002F Codex CLI 常用指令速查表","整理 Claude Code 與 Codex CLI 的常用斜線指令、快捷操作與進階功能，方便需要時快速查找。",[230,231,232,265,315],"速查表",{"id":317,"title":268,"body":318,"category":228,"description":269,"draft":1182,"extension":556,"image":1183,"meta":1184,"navigation":592,"path":267,"publishedAt":1185,"relatedExperiments":1186,"seo":1187,"stem":1188,"tags":1189,"updatedAt":1183,"__hash__":1190},"posts\u002Fposts\u002F20260907.claude-codex-skills.md",{"type":319,"value":320,"toc":1166},"minimark",[321,325,336,339,345,348,357,360,366,369,372,377,380,386,389,392,398,401,407,410,413,415,419,422,425,431,433,439,442,448,451,457,460,462,466,469,474,477,480,486,489,496,498,502,505,511,513,519,522,528,531,534,540,543,545,549,552,665,668,671,677,684,686,690,693,698,701,707,710,716,722,727,730,732,736,739,745,748,754,757,763,766,772,775,781,784,786,790,793,796,802,805,811,814,820,823,826,832,843,845,849,852,858,861,864,870,872,878,884,887,889,893,985,988,990,994,997,1000,1006,1008,1014,1017,1023,1026,1029,1035,1037,1043,1046,1048,1052,1055,1060,1063,1069,1072,1078,1081,1083,1087,1090,1097,1100,1106,1109,1112,1118,1121,1123,1126,1129,1135,1138,1140,1146,1149,1156,1159,1162],[322,323,324],"p",{},"前面整理過：",[326,327,333],"pre",{"className":328,"code":330,"language":331,"meta":332},[329],"language-text","CLAUDE.md \u002F AGENTS.md\nRules\nCommands \u002F Slash Commands\n","text","",[334,335,330],"code",{"__ignoreMap":332},[322,337,338],{},"接下來是：",[326,340,343],{"className":341,"code":342,"language":331,"meta":332},[329],"Skills\n",[334,344,342],{"__ignoreMap":332},[322,346,347],{},"可以先把 Skill 理解成：",[349,350,351],"blockquote",{},[322,352,353],{},[354,355,356],"strong",{},"把經常重複使用的工作流程整理起來，之後讓 AI 再次使用。",[322,358,359],{},"例如每次做某件事情，都會重複告訴 AI：",[326,361,364],{"className":362,"code":363,"language":331,"meta":332},[329],"先檢查目前修改\n↓\n執行測試\n↓\n確認有沒有問題\n↓\n最後整理結果\n",[334,365,363],{"__ignoreMap":332},[322,367,368],{},"如果這套流程之後還會一直使用，就可以考慮做成 Skill。",[370,371],"hr",{},[373,374,376],"h2",{"id":375},"skill-適合放什麼","Skill 適合放什麼？",[322,378,379],{},"Skill 比較適合：",[326,381,384],{"className":382,"code":383,"language":331,"meta":332},[329],"會重複使用\n+\n有固定步驟\n+\n之後仍然有價值\n",[334,385,383],{"__ignoreMap":332},[322,387,388],{},"的工作方式。",[322,390,391],{},"例如：",[326,393,396],{"className":394,"code":395,"language":331,"meta":332},[329],"建立 Commit\n功能完成後的收尾\n建立 Release\n文件整理\n測試流程\nSecurity Check\n",[334,397,395],{"__ignoreMap":332},[322,399,400],{},"以我目前使用的初始化流程來說，也會規劃像：",[326,402,405],{"className":403,"code":404,"language":331,"meta":332},[329],"\u002Fcommit\n\u002Fwrap-up\n\u002Frelease\n",[334,406,404],{"__ignoreMap":332},[322,408,409],{},"這類重複流程。",[322,411,412],{},"目的不是一開始建立很多 Skills，而是把之後可能反覆執行的工作整理起來。",[370,414],{},[373,416,418],{"id":417},"為什麼不全部寫進-claudemd-agentsmd","為什麼不全部寫進 CLAUDE.md \u002F AGENTS.md？",[322,420,421],{},"因為用途不太一樣。",[322,423,424],{},"可以先這樣理解：",[326,426,429],{"className":427,"code":428,"language":331,"meta":332},[329],"CLAUDE.md \u002F AGENTS.md\n↓\nAI 平常工作時一直需要知道的規則\n\n\nSkill\n↓\n執行某件特定工作時\n才需要的一套流程\n",[334,430,428],{"__ignoreMap":332},[322,432,391],{},[326,434,437],{"className":435,"code":436,"language":331,"meta":332},[329],"這個專案統一使用 npm\n",[334,438,436],{"__ignoreMap":332},[322,440,441],{},"這是整個專案都需要知道的資訊，比較適合：",[326,443,446],{"className":444,"code":445,"language":331,"meta":332},[329],"CLAUDE.md\nAGENTS.md\n",[334,447,445],{"__ignoreMap":332},[322,449,450],{},"但假設功能完成後，每次都需要：",[326,452,455],{"className":453,"code":454,"language":331,"meta":332},[329],"1. 檢查目前修改\n2. 執行相關測試\n3. 更新需要同步的文件\n4. 整理尚未完成的事項\n",[334,456,454],{"__ignoreMap":332},[322,458,459],{},"這種固定流程就比較適合整理成 Skill。",[370,461],{},[373,463,465],{"id":464},"skill-不需要一開始建立很多","Skill 不需要一開始建立很多",[322,467,468],{},"Skill 跟 Rules 一樣，不是：",[349,470,471],{},[322,472,473],{},"建立專案時一定要先準備完整的一套。",[322,475,476],{},"如果現在還沒有任何重複流程，其實完全可以不建立 Skill。",[322,478,479],{},"比較自然的方式是：",[326,481,484],{"className":482,"code":483,"language":331,"meta":332},[329],"先正常跟 AI 工作\n↓\n發現某件事情一直重複\n↓\n每次都要重新說明流程\n↓\n再考慮整理成 Skill\n",[334,485,483],{"__ignoreMap":332},[322,487,488],{},"所以 Skill 比較像：",[349,490,491],{},[322,492,493],{},[354,494,495],{},"用到之後才慢慢累積的工作流程。",[370,497],{},[373,499,501],{"id":500},"claude-code-skills","Claude Code Skills",[322,503,504],{},"Claude Code 的專案 Skill 可以放在：",[326,506,509],{"className":507,"code":508,"language":331,"meta":332},[329],"my-project\u002F\n└─ .claude\u002F\n   └─ skills\u002F\n      └─ wrap-up\u002F\n         └─ SKILL.md\n",[334,510,508],{"__ignoreMap":332},[322,512,391],{},[326,514,517],{"className":515,"code":516,"language":331,"meta":332},[329],".claude\u002Fskills\u002Fwrap-up\u002FSKILL.md\n",[334,518,516],{"__ignoreMap":332},[322,520,521],{},"就代表一個叫做：",[326,523,526],{"className":524,"code":525,"language":331,"meta":332},[329],"wrap-up\n",[334,527,525],{"__ignoreMap":332},[322,529,530],{},"的 Skill。",[322,532,533],{},"最基本可以只有一份：",[326,535,538],{"className":536,"code":537,"language":331,"meta":332},[329],"SKILL.md\n",[334,539,537],{"__ignoreMap":332},[322,541,542],{},"裡面寫這個 Skill 的用途與執行步驟。",[370,544],{},[373,546,548],{"id":547},"一個簡單的-skill","一個簡單的 Skill",[322,550,551],{},"例如功能完成後，希望 AI 幫忙檢查收尾：",[326,553,557],{"className":554,"code":555,"language":556,"meta":332,"style":332},"language-md shiki shiki-themes github-light github-dark-default","---\ndescription: 功能完成後使用，確認測試、文件與剩餘工作是否都已處理。\n---\n\n# 功能收尾\n\n確認目前修改內容。\n\n依序檢查：\n\n1. 相關測試是否通過。\n2. 是否有需要同步更新的文件。\n3. 是否存在尚未處理的 TODO。\n4. 整理本次修改內容與剩餘事項。\n","md",[334,558,559,568,582,587,594,601,606,612,617,623,628,638,647,656],{"__ignoreMap":332},[560,561,564],"span",{"class":562,"line":563},"line",1,[560,565,567],{"class":566},"szmH1","---\n",[560,569,571,575,578],{"class":562,"line":570},2,[560,572,574],{"class":573},"sXQ1o","description",[560,576,577],{"class":566},": ",[560,579,581],{"class":580},"sNbzA","功能完成後使用，確認測試、文件與剩餘工作是否都已處理。\n",[560,583,585],{"class":562,"line":584},3,[560,586,567],{"class":566},[560,588,590],{"class":562,"line":589},4,[560,591,593],{"emptyLinePlaceholder":592},true,"\n",[560,595,597],{"class":562,"line":596},5,[560,598,600],{"class":599},"sNGiL","# 功能收尾\n",[560,602,604],{"class":562,"line":603},6,[560,605,593],{"emptyLinePlaceholder":592},[560,607,609],{"class":562,"line":608},7,[560,610,611],{"class":566},"確認目前修改內容。\n",[560,613,615],{"class":562,"line":614},8,[560,616,593],{"emptyLinePlaceholder":592},[560,618,620],{"class":562,"line":619},9,[560,621,622],{"class":566},"依序檢查：\n",[560,624,626],{"class":562,"line":625},10,[560,627,593],{"emptyLinePlaceholder":592},[560,629,631,635],{"class":562,"line":630},11,[560,632,634],{"class":633},"sjlk-","1.",[560,636,637],{"class":566}," 相關測試是否通過。\n",[560,639,641,644],{"class":562,"line":640},12,[560,642,643],{"class":633},"2.",[560,645,646],{"class":566}," 是否有需要同步更新的文件。\n",[560,648,650,653],{"class":562,"line":649},13,[560,651,652],{"class":633},"3.",[560,654,655],{"class":566}," 是否存在尚未處理的 TODO。\n",[560,657,659,662],{"class":562,"line":658},14,[560,660,661],{"class":633},"4.",[560,663,664],{"class":566}," 整理本次修改內容與剩餘事項。\n",[322,666,667],{},"先做到這樣其實就已經可以了。",[322,669,670],{},"不需要一開始就加入很多：",[326,672,675],{"className":673,"code":674,"language":331,"meta":332},[329],"scripts\u002F\nreferences\u002F\nassets\u002F\n",[334,676,674],{"__ignoreMap":332},[322,678,679,680,683],{},"Skill 之後確實還能再搭配 Script、參考文件或其他資源，但如果只是保存固定工作流程，一份 ",[334,681,682],{},"SKILL.md"," 就足夠。",[370,685],{},[373,687,689],{"id":688},"claude-code-怎麼使用","Claude Code 怎麼使用？",[322,691,692],{},"例如 Skill 放在：",[326,694,696],{"className":695,"code":516,"language":331,"meta":332},[329],[334,697,516],{"__ignoreMap":332},[322,699,700],{},"可以直接使用：",[326,702,705],{"className":703,"code":704,"language":331,"meta":332},[329],"\u002Fwrap-up\n",[334,706,704],{"__ignoreMap":332},[322,708,709],{},"呼叫。",[322,711,712,713,715],{},"Claude Code 也可以根據 Skill 的 ",[334,714,574],{}," 判斷目前工作是否符合，在需要時自動載入 Skill。Skill 的完整內容不是每次 Session 一開始就全部載入，而是在真的使用時才讀取。",[322,717,718,719,721],{},"所以 ",[334,720,574],{}," 最好簡單寫清楚：",[349,723,724],{},[322,725,726],{},"這個 Skill 是做什麼，以及什麼情況適合使用。",[322,728,729],{},"不用一開始研究很多複雜設定。",[370,731],{},[373,733,735],{"id":734},"claude-code-的-skill-放哪裡","Claude Code 的 Skill 放哪裡？",[322,737,738],{},"可以先記兩個位置：",[326,740,743],{"className":741,"code":742,"language":331,"meta":332},[329],".claude\u002Fskills\u002F\n↓\n目前專案使用\n",[334,744,742],{"__ignoreMap":332},[322,746,747],{},"以及：",[326,749,752],{"className":750,"code":751,"language":331,"meta":332},[329],"~\u002F.claude\u002Fskills\u002F\n↓\n自己的多個專案都能使用\n",[334,753,751],{"__ignoreMap":332},[322,755,756],{},"例如只有這個專案特有的：",[326,758,761],{"className":759,"code":760,"language":331,"meta":332},[329],"功能完成收尾流程\n",[334,762,760],{"__ignoreMap":332},[322,764,765],{},"可以放：",[326,767,770],{"className":768,"code":769,"language":331,"meta":332},[329],".claude\u002Fskills\u002F\n",[334,771,769],{"__ignoreMap":332},[322,773,774],{},"如果是不管做哪個專案都想使用的工作方式，才考慮：",[326,776,779],{"className":777,"code":778,"language":331,"meta":332},[329],"~\u002F.claude\u002Fskills\u002F\n",[334,780,778],{"__ignoreMap":332},[322,782,783],{},"Claude Code 官方目前也是以 Project 與 Personal Skill 區分這兩種使用範圍。",[370,785],{},[373,787,789],{"id":788},"codex-也支援-skills","Codex 也支援 Skills",[322,791,792],{},"Codex 的概念很接近。",[322,794,795],{},"專案 Skill 主要放在：",[326,797,800],{"className":798,"code":799,"language":331,"meta":332},[329],"my-project\u002F\n└─ .agents\u002F\n   └─ skills\u002F\n      └─ wrap-up\u002F\n         └─ SKILL.md\n",[334,801,799],{"__ignoreMap":332},[322,803,804],{},"所以要注意：",[326,806,809],{"className":807,"code":808,"language":331,"meta":332},[329],"Claude Code\n↓\n.claude\u002Fskills\u002F\n\n\nCodex\n↓\n.agents\u002Fskills\u002F\n",[334,810,808],{"__ignoreMap":332},[322,812,813],{},"Codex 不是：",[326,815,818],{"className":816,"code":817,"language":331,"meta":332},[329],".codex\u002Fskills\u002F\n",[334,819,817],{"__ignoreMap":332},[322,821,822],{},"這一點比較容易搞混。",[322,824,825],{},"使用者自己的跨專案 Skill 則可以放：",[326,827,830],{"className":828,"code":829,"language":331,"meta":332},[329],"~\u002F.agents\u002Fskills\u002F\n",[334,831,829],{"__ignoreMap":332},[322,833,834,835,838,839,842],{},"Codex 官方目前會從 Repository 中的 ",[334,836,837],{},".agents\u002Fskills\u002F"," 與使用者 ",[334,840,841],{},"$HOME\u002F.agents\u002Fskills\u002F"," 尋找 Skills。",[370,844],{},[373,846,848],{"id":847},"codex-怎麼使用-skill","Codex 怎麼使用 Skill？",[322,850,851],{},"Codex 可以使用：",[326,853,856],{"className":854,"code":855,"language":331,"meta":332},[329],"\u002Fskills\n",[334,857,855],{"__ignoreMap":332},[322,859,860],{},"查看或選擇 Skill。",[322,862,863],{},"也可以在 Prompt 裡輸入：",[326,865,868],{"className":866,"code":867,"language":331,"meta":332},[329],"$skill-name\n",[334,869,867],{"__ignoreMap":332},[322,871,391],{},[326,873,876],{"className":874,"code":875,"language":331,"meta":332},[329],"$wrap-up 幫我整理目前功能的收尾工作\n",[334,877,875],{"__ignoreMap":332},[322,879,880,881,883],{},"Codex 也可以根據 Skill 的 ",[334,882,574],{}," 自動判斷目前任務是否適合使用。",[322,885,886],{},"所以 Claude Code 與 Codex 的核心概念其實很接近，只是目錄與手動呼叫方式不同。",[370,888],{},[373,890,892],{"id":891},"claude-code-codex-簡單對照","Claude Code \u002F Codex 簡單對照",[894,895,896,910],"table",{},[897,898,899],"thead",{},[900,901,902,906,908],"tr",{},[903,904,905],"th",{},"項目",[903,907,231],{},[903,909,296],{},[911,912,913,928,943,956,975],"tbody",{},[900,914,915,919,924],{},[916,917,918],"td",{},"專案 Skill",[916,920,921],{},[334,922,923],{},".claude\u002Fskills\u002F",[916,925,926],{},[334,927,837],{},[900,929,930,933,938],{},[916,931,932],{},"使用者 Skill",[916,934,935],{},[334,936,937],{},"~\u002F.claude\u002Fskills\u002F",[916,939,940],{},[334,941,942],{},"~\u002F.agents\u002Fskills\u002F",[900,944,945,948,952],{},[916,946,947],{},"主要文件",[916,949,950],{},[334,951,682],{},[916,953,954],{},[334,955,682],{},[900,957,958,961,966],{},[916,959,960],{},"手動使用",[916,962,963],{},[334,964,965],{},"\u002Fskill-name",[916,967,968,971,972],{},[334,969,970],{},"\u002Fskills"," 或 ",[334,973,974],{},"$skill-name",[900,976,977,980,983],{},[916,978,979],{},"可依任務自動選擇",[916,981,982],{},"可以",[916,984,982],{},[322,986,987],{},"如果目前只想先理解 Skill，其實先知道這些就夠了。",[370,989],{},[373,991,993],{"id":992},"skill-跟-rules-差在哪","Skill 跟 Rules 差在哪？",[322,995,996],{},"這是我覺得比較重要的差別。",[322,998,999],{},"可以先簡單記：",[326,1001,1004],{"className":1002,"code":1003,"language":331,"meta":332},[329],"Rules\n↓\n平常工作時需要遵守什麼\n\n\nSkills\n↓\n遇到某件事情時應該怎麼做\n",[334,1005,1003],{"__ignoreMap":332},[322,1007,391],{},[326,1009,1012],{"className":1010,"code":1011,"language":331,"meta":332},[329],"新增 Production Dependency 前需要確認\n",[334,1013,1011],{"__ignoreMap":332},[322,1015,1016],{},"比較像：",[326,1018,1021],{"className":1019,"code":1020,"language":331,"meta":332},[329],"Rule\n",[334,1022,1020],{"__ignoreMap":332},[322,1024,1025],{},"因為不管正在處理什麼工作，都希望 AI 遵守。",[322,1027,1028],{},"但是：",[326,1030,1033],{"className":1031,"code":1032,"language":331,"meta":332},[329],"功能完成後：\n\n1. 執行測試\n2. 檢查文件\n3. 整理 TODO\n4. 輸出收尾摘要\n",[334,1034,1032],{"__ignoreMap":332},[322,1036,1016],{},[326,1038,1041],{"className":1039,"code":1040,"language":331,"meta":332},[329],"Skill\n",[334,1042,1040],{"__ignoreMap":332},[322,1044,1045],{},"因為只有進行「功能收尾」時才需要執行這套流程。",[370,1047],{},[373,1049,1051],{"id":1050},"不知道該不該做成-skill也可以問-ai","不知道該不該做成 Skill，也可以問 AI",[322,1053,1054],{},"如果已經發現某些 Prompt 一直重複，但不知道：",[349,1056,1057],{},[322,1058,1059],{},"這到底值不值得做成 Skill？",[322,1061,1062],{},"也可以直接請 AI 幫忙判斷：",[326,1064,1067],{"className":1065,"code":1066,"language":331,"meta":332},[329],"請檢查我們最近重複使用的工作流程。\n\n哪些內容適合整理成 Skill？\n哪些應該留在 CLAUDE.md \u002F AGENTS.md？\n\n先提出建議，不要直接建立檔案。\n",[334,1068,1066],{"__ignoreMap":332},[322,1070,1071],{},"如果確定某一套流程值得留下，也可以再請 AI：",[326,1073,1076],{"className":1074,"code":1075,"language":331,"meta":332},[329],"請把這套流程整理成一個最簡單的 Skill。\n\n先只建立 SKILL.md，\n不要額外加入 Script 或其他複雜設定。\n",[334,1077,1075],{"__ignoreMap":332},[322,1079,1080],{},"這樣不用一開始就自己研究完整 Skill 規格。",[370,1082],{},[373,1084,1086],{"id":1085},"什麼時候才值得建立-skill","什麼時候才值得建立 Skill？",[322,1088,1089],{},"我目前會先用一個很簡單的方法判斷：",[349,1091,1092],{},[322,1093,1094],{},[354,1095,1096],{},"這套工作方式，我是不是已經重複講過很多次？",[322,1098,1099],{},"如果只是：",[326,1101,1104],{"className":1102,"code":1103,"language":331,"meta":332},[329],"幫我修改首頁按鈕\n",[334,1105,1103],{"__ignoreMap":332},[322,1107,1108],{},"這種一次性工作，就沒有必要建立 Skill。",[322,1110,1111],{},"但如果每次都會出現：",[326,1113,1116],{"className":1114,"code":1115,"language":331,"meta":332},[329],"先做 A\n↓\n再檢查 B\n↓\n執行 C\n↓\n最後按照固定格式整理\n",[334,1117,1115],{"__ignoreMap":332},[322,1119,1120],{},"而且之後還會再做，就可以考慮整理起來。",[370,1122],{},[373,1124,1125],{"id":1125},"最後簡單整理",[322,1127,1128],{},"可以先把前面的概念整理成：",[326,1130,1133],{"className":1131,"code":1132,"language":331,"meta":332},[329],"CLAUDE.md \u002F AGENTS.md\n↓\n專案平常需要知道的規則\n\n\nRules\n↓\n規則變多後再分類整理\n\n\nCommands\n↓\n快速控制 CLI \u002F Session\n\n\nSkills\n↓\n保存會重複使用的工作流程\n",[334,1134,1132],{"__ignoreMap":332},[322,1136,1137],{},"Skill 不需要一開始建立很多。",[322,1139,479],{},[326,1141,1144],{"className":1142,"code":1143,"language":331,"meta":332},[329],"正常跟 AI 工作\n↓\n發現某個流程一直重複\n↓\n請 AI 協助整理\n↓\n確認真的值得保留\n↓\n再建立 Skill\n",[334,1145,1143],{"__ignoreMap":332},[322,1147,1148],{},"對我來說，先知道：",[349,1150,1151],{},[322,1152,1153],{},[354,1154,1155],{},"「重複工作流程可以整理成 Skill」",[322,1157,1158],{},"就已經足夠。",[322,1160,1161],{},"等真的開始需要 Script、Reference、更多 Frontmatter 或進階設定時，再另外研究即可。",[1163,1164,1165],"style",{},"html pre.shiki code .szmH1, html code.shiki .szmH1{--shiki-default:#24292E;--shiki-dark:#E6EDF3}html pre.shiki code .sXQ1o, html code.shiki .sXQ1o{--shiki-default:#22863A;--shiki-dark:#7EE787}html pre.shiki code .sNbzA, html code.shiki .sNbzA{--shiki-default:#032F62;--shiki-dark:#A5D6FF}html pre.shiki code .sNGiL, html code.shiki .sNGiL{--shiki-default:#005CC5;--shiki-default-font-weight:bold;--shiki-dark:#79C0FF;--shiki-dark-font-weight:bold}html pre.shiki code .sjlk-, html code.shiki .sjlk-{--shiki-default:#E36209;--shiki-dark:#FFA657}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":332,"searchDepth":584,"depth":584,"links":1167},[1168,1169,1170,1171,1172,1173,1174,1175,1176,1177,1178,1179,1180,1181],{"id":375,"depth":570,"text":376},{"id":417,"depth":570,"text":418},{"id":464,"depth":570,"text":465},{"id":500,"depth":570,"text":501},{"id":547,"depth":570,"text":548},{"id":688,"depth":570,"text":689},{"id":734,"depth":570,"text":735},{"id":788,"depth":570,"text":789},{"id":847,"depth":570,"text":848},{"id":891,"depth":570,"text":892},{"id":992,"depth":570,"text":993},{"id":1050,"depth":570,"text":1051},{"id":1085,"depth":570,"text":1086},{"id":1125,"depth":570,"text":1125},false,null,{},"2026-09-07",[],{"title":268,"description":269},"posts\u002F20260907.claude-codex-skills",[230,231,232,271],"ThUJ1mCgf6ioQxWUYS3i0XVp8YEt1LlQEIEtiko8VhM",[1192,1195],{"title":274,"path":273,"stem":1193,"description":275,"category":228,"publishedAt":1194,"children":-1},"posts\u002F20260908.claude-codex-agents-subagents","2026-09-08",{"title":262,"path":261,"stem":1196,"description":263,"category":228,"publishedAt":1197,"children":-1},"posts\u002F20260906.claude-codex-slash-commands","2026-09-06",1791786900623]