最近剛認識了 NX 這套 monorepo 工具,就想將一直以來開發各個專案時使用到的工具做個整合,順便摸熟 monorepo 的架構,主要會以 NX + NextJS 做基礎,也想試試能不能在一個資源庫中搭配多種框架(Vue , React Native 等)。
上一篇提到了 NX 可以顯示專案間的依賴關係,這邊的依賴關係分兩種,project 跟 target 。 project 之間的依賴關係主要由 NX 掃描整個程...
NX 可以同步執行多個 target ,並且會依據這些 target 的 dependency 依序執行,這個行為也被稱作 task pipeline,圖解會像...
把 Next.js 專案部署上 Vercel 非常簡單,註冊帳號後選擇連動的 Github 帳號,然後建立 project 選擇要部署的 Repo ,搭配 Ve...
開始來仔細研究 Next.js 13 的 App router 功能。 首先是基本的定義方式,route 結構是根據 app 目錄底下的內容去定義的,會跟據資...
繼續介紹一些除了 page 以外 App Router 會識別的特殊文件名稱。 loading 現在 Next.js 預設 page 都是 Server Com...
介紹 App Router 其他比較奇巧型的路由(?)定義。 Parallel Router 除了定義 page 作為路由的主要頁面外,也可以定義額外的頁面區塊...
來介紹最近喜歡的 API 串接工具 TanStackQuery。 主要用來解決幾個問題: 管理 API 前端快取,包含自動重取過期的快取,以及更新資料後手動更...
來試試看在 NX 中加入 Vue 框架的 Nuxt 專案。 首先目前 NX 還沒有針對支援 Nuxt 的擴充,所以大多步驟要手動進行。 要將 Nuxt 專案建立...
來嘗試在 NX 中建立 Vue 元件庫 lib。 跟 Nuxt 一樣,目前官方沒有支援 Vue 的擴充,所以要手動設定。 首先建立一個基於 Vite 的 js...
NX 有提供擴充工具幫助快速生成專案或是元件庫的架構,像是: pnpm exec nx generate @nx/next:application 利用擴充工...