nuxt-capo

Capo.js 在 Nuxt 中的實現

capo.js 用於 Nuxt

npm versionnpm downloadsGithub ActionsCodecov

capo.jsNuxt 3 中的實現

什麼是 Capo.js

Capo.js 是一個小型程式碼片段,透過改變頁面 <head> 部分中元素的順序,識別提升頁面(感知)效能的方法。

功能

  • ✨ 在開發模式和預渲染頁面時驗證您的 <head>
  • 🔎 視覺化最佳 head 配置

安裝

安裝 nuxt-capo 並將其新增到您的 nuxt.config 中。

npx nuxi@latest module add capo
export default defineNuxtConfig({
  modules: ['nuxt-capo'],
})

使用

就是這樣!您現在應該在伺服器渲染路由時看到除錯資訊和建議

Optimal head configurationSuggestions for head

鳴謝

感謝 @rviscomi 製作了 capo.js

💻 開發

  • 克隆此倉庫
  • 使用 corepack enable 啟用 Corepack (對於 Node.js < 16.10,請使用 npm i -g corepack)
  • 使用 pnpm install 安裝依賴
  • 使用 pnpm dev:prepare 模組
  • 執行 pnpm dev 以開發模式啟動 playground

許可證

用 ❤️ 製作

根據 MIT 許可證 釋出。