README.ch.md

vue-devtool-flash-updates

---

🇬🇧 English Version
🇨🇳 中文版 👈
🇯🇵 日本語版

---

一个方便的工具，可以突出显示重新渲染的组件！

这个插件使Vue项目能够通过突出显示重新渲染的组件来快速发现性能问题，就像React Developer Tools所做的那样。

目录

• 现场演示🔥
• 安装
• 用法
• 可用的选项
• 捐赠者
• 贡献方法
• 许可证

现场演示🔥

想快速看到它的性能吗？

下面是一个启用了插件的繁琐的模拟todo app。

1. 在此下载Chrome扩展程序。
2. 在此访问演示网站。
3. 在devtool面板上，选择 "Vue Flash Updates "选项卡，并启用能力!⚡️⚡️

你也会看到更新后的组件名称被打印在控制台中!

安装

npm install -D vue-devtool-flash-updates

或者

yarn add -D vue-devtool-flash-updates

用法

1. 从Chrome Web Store下载扩展.
2. 安装软件包并在所需的项目中设置该插件。

import FlashUpdates from 'vue-devtool-flash-updates'

Vue.use(FlashUpdates)

3. 打开Chrome Developer Tools，启用该插件。

就是这么简单的 🔥

---

对了， 如果你喜欢这个插件，在GitHub上给这个repo加星，真的会提高我继续改进它的动力💪

---

可用的选项

名称	类型	默认值	描述
logUpdatedComponents	布尔值	false	true的时候, 在控制台中以debug级别打印更新的组件名称。
isProduction	布尔值	false	true的时候, 停止插件.

窍门⚡️:
为了防止随机用户在production网站上使用该插件，建议你为isProduction选项传递一个布尔值。
推荐的方法是将 process.env.NODE_ENV === 'production'传递给插件，并让模块捆绑器如webpack来转换环境变量。

import FlashPlugin from 'vue-devtool-flash-updates'
Vue.use(FlashPlugin, {
  isProduction: process.env.NODE_ENV === 'production' // 该插件在production环境中停止，在其他环境中动作。
})

捐赠者

如果你发现任何错误或有任何建议，请提交一个issue这里

@yuichkun

Contributing

看到 the contributing file!

欢迎大家的PRs😎!

小提示：如果编辑README，请符合standard-readme的规范。

许可证

MIT © 2021 Yuichi Yogo