Claude Code教學：不用寫程式，做Chrome AI摘要外掛|數位時代 BusinessNext

你可能已經很會問 AI 問題了：請它摘要文章、改文案、整理資料，通常都能得到不錯的答案。但真正麻煩的是，很多工作明明每週都在重複，卻還是得一次次貼資料、講規則、調格式。

Claude Code 想解決的就是痛點。它不是只給工程師寫程式，而是讓你用自然語言，把固定流程變成電腦裡真的能執行的小工具，把 AI agent 的發揮空間開到最大。

這篇文章會帶你做一個很小、但很有感的例子。你可以學會親手（其實是動嘴）做出一個瀏覽器外掛：在任何網頁上反白一段文字，按右鍵，三句話的中文摘要便跳出來。這類摘要外掛市面上其實不少，但這一個是照你的需求量身調整的。

這是《數位時代》Claude 系列教學。前兩篇分別介紹 Claude Skills 與 Claude Cowork；沒看過也沒關係，本文會從 Claude Code 的基本概念開始說起。

如果你還沒安裝 Claude Code，可以先看這篇 Claude Code 安裝教學；本文會從桌面版 Code 分頁開始。想查 /init、/rewind 等斜線指令，則可搭配 Claude Code 快捷鍵＋指令大全一起讀。

如果你已經裝好 Claude 桌面版，請打開左上角 Chat、Cowork 旁邊那個你可能還沒點過的分頁：Code。

我們開始吧。

Claude Code vs Cowork：想做出工具，用哪個？

先說結論，Cowork 和 Claude Code 是同一個趨勢的兩種介面：AI 不再只是回答問題，而是走進你的工作環境，幫你讀資料、跑步驟、整理成果。差別只在一件事：Cowork 降低了這件事的門檻，Claude Code 則保留了它的原始力量。

Claude Code，這名字容易讓人以為它只適合寫程式。不過其真正的本事不在「寫 code」，而在於：你給它一個工作資料夾，它就能在裡面讀檔、改檔、跑指令，照你定的規則一步步把多步驟任務做完。對工程師來說，那個資料夾是一個軟體專案；對媒體編輯、研究員、行銷或分析師來說，它一樣可以是一疊採訪逐字稿、PDF、表格或簡報素材。換句話說，Claude Code 的價值不是「會寫程式」，而是它給了你一種「讓 AI 走進你工作流程」的方式。

先別被它的出身嚇到，它最早是工程師長在「終端機」（黑底白字、只能打字的視窗）裡用的工具。但你根本不用碰那個黑畫面，六月裝的桌面 App，左上角 Chat、Cowork 旁邊那個一直被你略過的 Code 分頁，就是它。
而 Cowork 則更像一般人的 AI 工作助理，它用圖形化介面把門檻壓到很低，你不必懂終端機、資料夾規則或版本控管，也能請 AI 幫你整理檔案、產生報告、處理表格、彙整資料，甚至串接瀏覽器、信箱和雲端。它把 Claude Code 的概念，包裝成辦公室工作者更好理解、更好操作的樣子。

自我檢核：你的工作能套哪一種？

你的情境	用哪個
臨時問問題，或只需要改一段文字	Chat
有一批檔案要處理，希望 AI 跑完整個流程、交出成果	Cowork
想做一個能反覆叫用的小工具，每次省掉固定的手工	Claude Code

以媒體編輯來說，就算一行程式都不寫，你也能用它整理採訪逐字稿、比對新聞資料、摘要一疊 PDF、產出選題清單、建立查核流程，或把散在各處的來源彙整成一份可交付的報告。這些都不是寫程式，卻全都命中 Claude Code 最擅長的模式：在一個資料夾裡，照明確規則，處理多個檔案、產出有結構的成果。

做瀏覽器外掛前，先把 Claude Code 設好

此單元是純操作。五個步驟，約 10 分鐘設完，之後就能開始做東西。

步驟 1：打開 Claude 桌面版，切到 Code 分頁

打開你六月裝的 Claude 桌面 App，左上角有 Chat、Cowork、Code 三個分頁，點下 Code。第一次進入可能會跳出一段使用說明，看過按掉即可。

步驟 2：建立 Claude Code 專用工作資料夾

跟六月的 Cowork 一樣，Claude Code 也要在一個資料夾裡工作。先別讓它對著整個「文件」或整個桌面動手，否則它會看到一堆無關檔案。在桌面或 Finder（Mac）／檔案總管（Windows）新增一個空資料夾，取名 claude-code-練習場（或任何你喜歡的名字），再回到 Code 分頁把工作範圍指向這個資料夾。它會詢問要不要授權存取，然後允許它讀寫這個資料夾。

步驟 3：選模型，簡單任務用快模型、規畫用強模型

畫面上有一個模型選擇器，可用選項以發刊當月 App 畫面為準。原則是：能力愈強的模型思考愈深入，但速度較慢也較吃用量；能力較輕的模型快、省，適合簡單瑣事。Haiku 4.5 是最輕量的選項，這期的實戰外掛就是用它呼叫摘要 API，既快又便宜。複雜任務的「規畫／施工」搭配策略，單元三會細講。

步驟 4：用 /init 建立新手版 CLAUDE.md

在輸入框打一條斜線指令 /init 送出，Claude 會掃一遍資料夾，自動生出一個叫 CLAUDE.md 的檔案。這份檔案就是六月教過的「資料夾規則檔」，Code 每次開工前都會先讀它，等於是你寫給 AI 的常駐備忘錄。
如果已經做過 CLAUDE.md 的話，可以複製過來用，如果資料夾完全是空的，你也可以直接跟它說「這個資料夾我要拿來做瀏覽器外掛練習」（為了下文的實作題目）。

圖2：利用 /init 寫 CLAUDE.md。資料夾若是空的，Claude 會詢問你期望的專案方向，使用者只要依照需求回答即可。

至於一份新手友善的 CLAUDE.md，內容可以簡單到像這樣幾條規則：

動我電腦上的任何檔案前，先問過我。
要安裝任何套件或工具前，先問我。
絕對不要碰我的 API 金鑰或任何密碼。
所有回覆和產出，一律用繁體中文。
動手前先列計畫，等我說好再做。
如果有多種做法，先列出來讓我選，不要自己決定。
每做完一個步驟，說明做了什麼、結果是什麼，再問要不要繼續。
遇到錯誤訊息，先用白話文解釋問題出在哪，再問我怎麼處理。
不確定我的意思時，先問清楚，不要自己猜著做。
一次只做一件事，確認沒問題再往下。

補充一點：CLAUDE.md 是給 Claude 的工作規則，不是系統層級的安全鎖。真正能限制 Claude 讀寫與指令執行的，是 Claude Code 的權限設定，也就是下一步要認識的「授權關卡」。

步驟 5：認識 Claude Code 的授權關卡

當 Claude 要執行尚未獲准的寫檔或指令操作時，系統會依目前的權限模式詢問你是否放行。這是最重要的防線：Claude Code 能放手做的多寡，最終都由你拍板。新手階段建議保持手動，看過再點「允許」；等熟練了，再考慮調整設定。

Claude Code 五種權限模式差在哪？

• Ask permissions｜每次 Claude 要讀檔、寫檔或執行指令，都會先停下來問你要不要放行。動作最慢、最安全，推薦新手一開始使用。
• Accept edits｜Claude 可以自動接受它自己提出的檔案修改，但執行指令（跑程式、安裝套件）仍會問你。適合已經熟悉流程、想省去確認改檔這步的用戶。
• Plan mode｜Claude 只能分析和規畫，完全不能動任何檔案或執行任何指令。適合你想先看清楚 Claude 打算怎麼做、確認方向對了再正式開工。
• Auto mode（預設）｜Claude 自主判斷什麼時候需要問你。大多數人的日常工作模式，在速度與安全之間取得平衡。
• Bypass permissions｜Claude 不問你，直接執行所有動作。適合對整個流程已經非常熟悉、需要全自動跑的進階用戶。

設好這五步，你的 Claude Code 就準備好了。下一單元，我們來搞懂它跟 Cowork 最不一樣的地方。

非工程師使用 Claude Code 的工作流程：先規畫、再執行

先說結論，Claude Code 跟 Cowork 最大不同在於，它有一個固定的工作節奏：先想、再做、壞了就修。這套循環學起來，之後做什麼工具都一樣，工具類型反而不重要了。

先用強模型規畫：讓 Claude Code 列出實作計畫

做東西最怕的，是需求還很模糊，就讓 AI 急著動手蓋房子，蓋到一半才發現方向錯了，整片拆掉重來。比較穩健的做法是先切換能力較強的模型，再換到「計畫模式」（Plan Mode），把需求講清楚：要解決什麼問題、有哪些核心功能，最後加一句「有不清楚的地方，請先問我，不要急著動工」。

Claude 會先丟幾個問題補齊模糊處，再給你一份完整計畫。這份計畫是整個流程最重要也最便宜的檢查點。在此抓出錯誤，遠比程式寫完才發現更有效率。

再用快模型執行：照計畫產出外掛檔案

計畫看過、沒問題，再視速度與用量需求換到較輕的模型，跟它說「照這份計畫做」。這個搭配策略值得記起來：讓較強的模型當建築師，負責畫藍圖；讓較快的模型當工班，負責照圖蓋房子。用會想的模型想、用會做的模型做，又快又省。下方以目前畫面中的 Opus／Sonnet 示範，實際可用模型以 App 顯示為準。

測試卡住怎麼辦？把錯誤訊息貼回 Claude Code

AI 做出的第一版常會有些地方怪怪的，這很正常。修法只有兩種，都不用你懂程式：哪裡長得不對就直接截一張圖丟給它，說「修這個」。它看圖就知道你指的是哪個按鈕、哪段文字，不用你費力描述；若跑出一串錯誤訊息，就把錯誤訊息整段複製（或截圖）貼回去，說「給我搞定喔！」它就會自己讀錯誤、定位到出問題的那一行、改掉，再請你測一次。

你要做的，就是重複這個循環：測一下、有問題就貼回去、它修好、再測，直到對為止。

有時候會遇到「修好這裡、那裡又壞了」的狀況。這也很正常，別慌。遇到這種情形，把新的問題描述清楚，同時告訴 Claude 它剛才改了什麼，例如「你剛才改了按鈕顏色，但現在摘要框消失了」。它需要這個上下文才能正確定位問題，不然容易繞圈子。若反覆繞了三輪以上都修不好，通常較有效的做法是打 /rewind 退回一個乾淨的起點，重新給它一個更具體的指示。

用 /rewind 和 git commit 保留還原點

敢大膽實驗的底氣，來自隨時能反悔。先記住這組定位：/rewind 是這次對話的後悔藥， git commit 是永久的存檔點。一個臨時、自動；一個長久、手動。

/rewind 就像 Word 的「復原」加強版。Claude 每次動手改檔案前，都會自動存一個點。改歪了，在輸入框打 /rewind，或趁輸入框是空的連按兩次 Esc，便會跳出選單讓你挑選倒回哪一步，連同對話一起。但有兩個限制要記住：它只跟著目前這個 session，並非永久版本紀錄，session 被刪除或無法恢復時，檢查點也會一起失效；透過指令直接刪除或搬移的檔案，也不一定在可還原範圍內。

所以你還需要 Git。它比較像「另存新檔＋寫版本說明」，把整個資料夾的當下狀態拍成快照，永久收起來，哪天改壞了還能翻回任一版。不用你懂指令：首先跟 Claude 說「幫這個資料夾設好 Git」，之後每做好一個功能說「幫我 commit，說明寫『加好摘要功能』」，它就自動完成了。

最安全的習慣是兩者搭配使用：開工前先 commit 存一個乾淨的起點，中途改歪用 /rewind 快速退回，做到滿意再 commit 鎖住成果。小範圍後悔用 /rewind，大階段成果用 commit 保住。

最後提醒一個新手很快會遇到的狀況：對話拖太長，Claude 開始變笨、忘東忘西。這是正常現象，因為它的「工作記憶」被塞滿了。想知道是不是快滿了，可以打 /context 查看；真的太長，則打 /compact 將舊對話壓成重點，或乾脆開新視窗重講一次。乾淨的對話，幾乎永遠比又長又亂的對話聰明。

斜線指令一次看

指令	用途
/init	掃描資料夾、自動生成 CLAUDE.md 規則檔
/rewind	叫出還原選單，把對話或檔案倒回先前某一步（也可在空輸入框連按兩次 Esc）
/context	看目前對話塞了多滿
/compact	把舊對話壓成重點，騰出空間

先想、再做、壞了就修，這三步跑熟，你就握住了 Claude Code 的核心。下一單元，我們真的拿它來做一個工具。

Claude Code 實戰：做一個 Chrome 右鍵 AI 摘要外掛

把前三單元整合起來，我們做一個真的工具：一個 Chrome 擴充功能，在任何網頁上反白一段文字、按右鍵，三句話的中文摘要就跳出來。

挑這項題目有兩個理由。一是每天要讀一堆長文、報告、外電的人最有感；二是現成的摘要外掛雖然不少，卻很難「剛好合你意」，而這一個不論你之後想改成英文摘要、五個重點或更換顯示位置，一句話就能調整。

準備 Anthropic API Key，讓外掛能呼叫 Claude

資料夾沿用單元二的 claude-code-練習場就行。比較不一樣的是，摘要要靠 AI 生成，所以這個外掛需要一把 Anthropic 的 API 金鑰（等於讓你的外掛能呼叫 Claude 的「通行證」）。別被「API」、「儲值」這些字嚇到，照下面三步走，大概十分鐘就能拿到：

註冊登入：到開發者平台 console.anthropic.com，用 Google 帳號或 email 註冊。這跟你平常用的 claude.ai 是不同的地方，是給開發者拿金鑰、看用量的後台。
儲一點額度：進 Settings → Plans & Billing，按「Add to credit balance」綁信用卡加值。API 是預付制，先儲值才能使用，儲 5 美元（約新台幣 160 元）就很夠了。這支外掛用最便宜的 Haiku 4.5，摘要短篇文字通常只需幾分之一塊錢；5 美元視每次送出的文字長度，可使用數百到數千次。
建一把金鑰：進 Settings → API Keys，按「Create Key」。金鑰是 sk-ant- 開頭的一長串字，只會完整顯示這一次，請當場複製、貼到記事本存好。這把鑰匙等於你的付費帳號通行證，千萬別放在任何公開的地方。

⚠️ 安全提醒：把 API 金鑰填在設定頁，只是避免把它直接寫死在程式碼裡，並不代表金鑰受到完善保護。任何能開啟你瀏覽器的人，都可以從擴充功能的設定頁取得金鑰。要注意，這個做法僅適合個人、本機、短期練習，請確認以下五件事：

1. 建立一把練習專用金鑰，不要用平時工作的金鑰。
2. 若帳戶提供支出上限，請設低。
3. 同時關閉自動加值，或調低自動加值上限。
4. 練習結束後立刻刪除這把金鑰。
5. 不要用它摘要公司、客戶或未公開的資料。

用三件式 prompt 交辦 Chrome AI 摘要外掛

prompt 三件式：成品長什麼樣、有什麼約束、不確定時怎麼辦。把它套到這個外掛上，切到 Opus 4.8、開計畫模式，貼這段給它：

成品：做一個 Chrome 擴充。在任何網頁上反白文字、按右鍵，出現「一鍵 AI 摘要」選項；點下去，用三句話的繁體中文摘要，顯示在頁面右上角的小浮窗裡。

約束：摘要用 Anthropic 的 Claude Haiku 模型；API 金鑰讓我在外掛的設定頁自己填，不要寫死在程式裡；介面乾淨，別放多餘的東西。

不確定時：技術選擇上有不清楚的地方，先問我再動工，不要自己猜。

讓 Claude Code 產生 Chrome 擴充功能檔案

Claude 會先回你一份計畫，大致是：建一個設定檔定義這個外掛、一段程式負責處理右鍵選單和呼叫 Claude、一個設定頁讓你填金鑰，並說明會用 Haiku 模型。確認正確就核准，切到 Sonnet 5 說「照計畫做」。幾分鐘後，它會在資料夾裡生出幾個檔案，並告訴你接下來怎麼把外掛裝進瀏覽器。

載入 Chrome 擴充功能，測試右鍵 AI 摘要

打開 Chrome，網址列輸入 chrome://extensions；右上角開啟「開發人員模式」→「載入未封裝項目」→ ai-summary-extension/ 資料夾。外掛就裝好了。

第一次用，先點工具列的擴充圖示開啟設定頁，把步驟 1 那把金鑰貼上、儲存。然後找一篇長文，反白一段文字，按右鍵選「一鍵 AI 摘要」。右上角浮窗會轉圈，幾秒後出現三句話繁體中文摘要。

順手做一個錯誤測試：回設定頁把金鑰清空存檔，再試一次。浮窗會顯示「尚未設定 API 金鑰…」並自動跳回設定頁，確認錯誤提示有效，外掛才算完整。

做完後，你手上就有一個依照你需求調出來的工具，而且是你自己（動嘴）做出來的。想要改成「英文摘要」、「列五個重點」、「浮窗放左下角」？回到 Claude，一句話就幫你改。這就是 Claude Code 的迴圈：先做出一個能用的初版，再一句句把它調到你要的樣子。

你還能怎麼改？一句話就能調

想要的效果	直接跟 Claude 說
改成英文摘要	「把摘要語言從繁體中文改成英文」
列五個條列重點	「把三句話的格式改成五個條列重點」
浮窗移到左下角	「把右上角浮窗改到左下角顯示」
摘要變短一點	「把三句話壓成一句話就好」

Claude Code 還能做哪些工具？進階功能、限制與費用

既然你已經做出第一個工具了。這單元講三件事：Claude Code 還有哪些進階武器、天花板在哪以及該花多少錢？先來說武器庫。以下功能在 Claude Code 裡都是「原生公民」，設定好之後不用特別開口，它需要時自己會用：

• Skills：把你反覆要它做的事，包成一鍵就能叫用的技能（需事先建立）。
• MCP：把 Claude 接到外部服務，像 Notion、Gmail、GitHub，讓它能直接讀寫你的工具（需事先安裝並授權）。
• Subagents（分身）：把一個大任務拆給好幾個 AI 分身同時做，各做一塊再彙整。
• Hooks（自動觸發）：設一條死規則「每次發生 X 就一定做 Y」，百分百執行、不看 AI 心情，例如它一改完檔就自動發桌面通知給你（需事先設定）。

新手這裡有個坑要避開：別看到什麼都裝。少數幾個好用、架構清楚的 Skills，遠比裝一大堆雜的有用，後者只會讓 Claude 每次都得花力氣篩選。

再來是要認知到，Claude Code 取代不了工程師。如複雜的金融後台、有嚴格資安要求的醫療平台，這類需要多年領域知識與架構功力的系統，目前沒有 AI 工具能獨力扛下。因此 AI 工具的甜蜜點，是工作中那些卡很久、市面上又找不到現成解法的小工具。

最後是錢，這裡要分清楚兩筆帳。一筆是 Code 分頁本身：它含在你的 Claude 付費訂閱裡，多數人從 Pro 方案（每月約 20 美元，約新台幣 630 元）起步就夠，常用到上限再升級 Max，不必為了 Code 而另外付費。

另一筆是實戰外掛用到的 API 金鑰：那是給外掛呼叫 Claude 用的，按使用量另外計費，跟你的訂閱是兩本帳（好在 Haiku 摘要極為便宜）。記住一件事：你真的做出天天會用的工具，並為你省下時間就值得。

從會問 AI，到會用 Claude Code 做工具

回頭看《數位時代》這幾篇 Claude 教學，你其實已經走過一條完整的 AI 工作流路線。先從基礎的 Claude 入門學習地圖認識 Chat、Cowork、Code 各自適合什麼情境；接著用 Claude Skills 教學，把重複工作包成可重複啟動的小工具；再透過 Claude Cowork 教學，把 AI 從雲端對話框搬到本機資料夾，處理整批檔案。到了這一篇，你打開第三個分頁 Code，用 Claude Code 做出一個本來不存在的瀏覽器外掛，把「請 AI 回答問題」推進到「讓 AI 幫你做出工具」。

用下表來看，你正好從 Level 1 的對話使用者，把 Level 5 走完了。