透過 100 多個技巧學習 Nuxt!

nuxt-capo

用於 Nuxt 的 Capo.js 實作

用於 Nuxt 的 capo.js

npm versionnpm downloadsGithub ActionsCodecov

capo.js 用於 Nuxt 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 以在開發模式下啟動 遊樂場

授權許可

用 ❤️ 製作

MIT 授權下發布。