通过 100+ 技巧的集合学习 Nuxt!

nuxt-capo

Nuxt 的 Capo.js 实现

用于 Nuxt 的 capo.js

npm versionnpm downloadsGithub ActionsCodecov

capo.js implementation for 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 以在开发模式下启动 playground

许可证

用 ❤️ 制作

MIT 许可证下发布。