devtools

<a href="https://devtools.nuxt.com"><img width="1200" alt="Nuxt 开发工具" src="https://yellow-cdn.veclightyear.com/835a84d5/04103f5b-a203-4721-8172-5f095024fb89.png"></a> <br>

<h1> Nuxt 开发工具 </h1>

<p> 释放 Nuxt 开发者体验。 <br>Nuxt 开发工具是一套可视化工具，帮助您更好地了解您的应用。 </p> <p> <a href="https://nuxt.com/blog/nuxt-devtools-v1-0">👋 介绍</a> | <a href="https://github.com/nuxt/devtools/discussions/29">💡 想法与建议</a> | <a href="https://github.com/nuxt/devtools/discussions/31">🗺️ 项目路线图</a> | <a href="https://devtools.nuxt.com/">📚 文档</a> </p> <br>

安装

Nuxt 开发工具需要 Nuxt v3.9.0 或更高版本。

Nuxt 开发工具在 Nuxt v3.8.0 中默认启用。您可以在应用中按下 <kbd>Shift</kbd> + <kbd>Alt</kbd> / <kbd>⇧ Shift</kbd> + <kbd>⌥ Option</kbd> + <kbd>D</kbd> 组合键来打开它。

如果您想明确启用或禁用 Nuxt 开发工具，可以在 nuxt.config 中进行如下更新：

export default defineNuxtConfig({
  devtools: {
    enabled: true // 或 false 以禁用
  }
})

边缘版本渠道

与 Nuxt 的每日构建渠道 类似，开发工具也提供边缘版本渠道，每次提交到 main 分支时都会自动发布。

您可以通过运行以下命令选择使用边缘版本渠道：

{
  "devDependencies": {
--    "@nuxt/devtools": "^0.1.0"
++    "@nuxt/devtools": "npm:@nuxt/devtools-edge@latest"
  }
}

删除锁文件（package-lock.json、yarn.lock 或 pnpm-lock.yaml）并重新安装依赖。

模块选项

要配置 Nuxt 开发工具，您可以传递 devtools 选项。

// nuxt.config.ts
export default defineNuxtConfig({
  devtools: {
    // 启用开发工具（默认：true）
    enabled: true,
    // VS Code 服务器选项
    vscode: {},
    // ...其他选项
  }
})

有关所有可用选项，请参考 IDE 中的 TSDocs 或 类型定义文件。

功能

阅读 公告博文 🎊 了解我们为什么构建 Nuxt 开发工具以及它能做什么！

模块作者

请参考 模块作者指南。

贡献指南

请参考 贡献指南。

匿名使用分析

Nuxt 开发工具收集有关一般使用情况的匿名遥测数据。这有助于我们准确衡量所有用户的功能使用和定制情况。这些数据将让我们更好地了解 Nuxt 开发工具中每个功能的使用情况，衡量改进（开发体验和性能）及其相关性。它还将帮助我们优先考虑我们的工作，并专注于对用户最重要的功能。

Nuxt 开发工具的遥测数据通过 Nuxt Telemetry 传输，这意味着 Nuxt 开发工具将遵守您的本地和全局 Nuxt Telemetry 设置。您还可以在 Nuxt 开发工具设置中选择退出 Nuxt 开发工具的遥测。

我们收集的数据完全匿名，无法追溯到源头（使用哈希+种子），且仅在聚合形式下有意义。我们收集的数据不包含任何可个人识别或可追踪的信息。

事件

除了 默认的 Nuxt Telemetry 事件 外，Nuxt 开发工具还收集以下事件：

• Nuxt 开发工具的版本
• 在标签/功能之间的导航
  • 这有助于我们了解哪些功能使用最多，从而优先考虑我们的工作。
• 浏览器和操作系统的名称和版本
  • 这有助于我们改善不同浏览器和操作系统的兼容性。
• 某些操作按钮的点击事件

许可证

MIT

<!-- 徽章 -->