netlify-frameworks

netlify-frameworks 技能概覽

netlify-frameworks 技能是一份部署指南，專門協助你把現代 Web 框架正確部署到 Netlify，而且比通用提示更少走冤枉路。當你要部署或排查 Vite/React、Astro、TanStack Start、Next.js、Nuxt、SvelteKit 或 Remix，並且需要知道 Netlify 對各框架的期待時，它特別有用。

它解決的是什麼問題

這個 netlify-frameworks skill 聚焦在真正的工作：把框架專案變成可正常運作的 Netlify 部署，尤其是牽涉到 SSR、API routes、middleware 或 platform primitives 的情況。它能幫你判斷你需要的是 adapter、plugin，還是單純靜態託管就夠了。

什麼情況最適合用

當你需要 netlify-frameworks for Deployment、框架專屬設定、本機開發與正式環境一致性，或是把框架的 server 功能轉成 Netlify Functions 和 Edge Functions 時，就很適合用它。若你已經熟悉框架本身，但不確定 Netlify 的接線方式應該怎麼做，它會特別有幫助。

它為什麼不一樣

它的核心價值是實作層面的相容性指引，而不是抽象的平台理論。它提供框架偵測線索、adapter/plugin 模式，以及參考路徑，讓你能從「我的 app 應該可以部署」直接走到「這是要先試的 Netlify 具體設定」。

如何使用 netlify-frameworks 技能

正確安裝並載入它

做 netlify-frameworks install 時，先把這個 skill 加進你的 skills workflow，然後先開啟 SKILL.md。把參考檔當成實作備註，而不是可有可無的延伸閱讀，因為那些框架專屬檔案通常才包含會影響結果的設定細節。

提供可直接部署的輸入資訊

最好的 netlify-frameworks usage 一開始就要有三個資訊：你的框架、輸出模式，以及目前卡住或還沒設定好的地方。例如：「把一個使用 Next.js App Router、帶 image optimization 和 middleware 的 app 部署到 Netlify」就比「幫我部署 Next.js」有效得多。

先讀對的檔案

先從 SKILL.md 開始，再跳到對應的參考檔，例如 references/nextjs.md、references/astro.md、references/tanstack.md 或 references/vite.md。這個 repo 的結構就是為了快速查框架而設計，所以第一輪應該是：先辨識框架、讀它的參考檔，再回頭檢查你自己專案裡的 build 或 routing 細節。

把模糊目標改寫成強提示

這個技能的好提示要明確點出框架、repo 結構與部署限制。例如：「我有一個 Vite + React SPA，使用 React Router，還有一個 /api/hello function。請提供 Netlify 設定、redirect rules 和本機開發設定。」這樣的提示能給技能足夠脈絡，產出可部署的答案，而不是泛泛而談的說明。

netlify-frameworks 技能 FAQ

只有帶 SSR 的框架 app 才能用嗎？

不是。netlify-frameworks 同時涵蓋靜態輸出與具備 server 能力的框架。如果你的 app 完全是靜態網站，它的價值主要在於幫你確認你其實不需要額外的 Netlify runtime 元件。

我會讀 Netlify 文件，還需要這個技能嗎？

如果你已經很熟框架和 Netlify 的部署模型，可能不一定需要。netlify-frameworks guide 更適合用在你想把從框架選型到可運作設定的決策路徑縮短，尤其是面對多個框架、而且各自 adapter 慣例不同的時候。

對初學者友善嗎？

可以，只要你能辨識自己的框架和 build command。若你不清楚 app 是 SPA、SSR、混合式，還是需要 edge awareness，對初學者就沒那麼友善，因為這些判斷會直接決定該看哪條參考路徑。

什麼時候不該用它？

如果你要部署的是沒有任何框架專屬行為的純靜態網站，或者你的問題跟框架整合無關，例如內容流程、CMS schema，或一般 JavaScript bug，就不該用 netlify-frameworks。

如何改進 netlify-frameworks 技能

先說清楚專案的框架型態

最大的品質提升來自於明確說出這個 app 是靜態、SSR、混合式，還是 API 較重。像是「Astro 的 hybrid mode，有一個 API route 和一個 prerendered 的行銷頁」就比「Astro on Netlify」更有行動性。

把 build 與 routing 限制一併寫出來

如果你的部署依賴 redirects、圖片處理、forms，或特定的 publish directory，請一開始就說明。當技能知道你需要的是 SPA fallback、function routing，還是 adapter output 驗證時，它就能給出更精準的建議。

直接要求你真正需要的產出

如果你要的是能直接貼回 repo 的內容，就請它輸出 netlify.toml、框架設定，以及最少必要的程式碼變更。如果你想先做診斷，就先要求可能的失敗點。這樣能讓答案聚焦在你下一步真的會套用的內容上。

以第一次部署結果為基礎持續修正

第一輪之後，把實際症狀回饋回去：build log 錯誤、route 不見了、SSR 不一致，或 function 找不到。這是提升 netlify-frameworks usage 最快的方法，因為下一輪回應就能從設定建議，縮小到特定 adapter 或 config 的邊界情況。