augury(Angular2专用的chrome调试插件) v1.0.4 官方免费版

augury是一款可以安装在谷歌浏览器上使用的Angular2专用的chrome调试插件，现在和VUE对比起来，确实可以看出有谷歌支持下angular2会更活跃，我个人认为2年后恐怕VUE无法与之抗衡，Augury还处于beta阶段，也还有很多问题，但是有些地方已经非常方便开发和调试了，大家可以来尝尝鲜！

官方介绍：

Extends the Developer Tools, adding tools for debugging and profiling Angular 2.0 applications.

Augury is a Google Chrome Dev Tool extension for debugging Angular 2 applications. Treat this as a "developer preview".

Augury特性：

1 用augury查看component结构；

ng2-admin项目结构

ng2-admin对应的的component结构

运行应用，打开浏览器查看页面，在开发者工具中可以看到，ComponentTree，这里可以非常清晰的看出appComponent的结构图，hover到component上面时，页面也会显示相应的位置。

2 查看单个Component的具体属性和方法；

3 可视化显示component关系；

4 查看router结构

结构真是一目了然，真是太牛逼了。

这些router结构，component结构可以帮助看看应用的结构是否存在问题。components中的具体方法，属性，用来调试具体内容的逻辑,有时候想换设一个值调下看看，可以直接在properties中改掉。

水太深，大家自行研究。

插件安装使用方法:

方法一：.Crx文件格式插件安装

1.首先用户点击谷歌浏览器右上角的自定义及控制按钮，在下拉框中选择设置。

2.在打开的谷歌浏览器的扩展管理器最左侧选择扩展程序或直接输入：chrome://extensions/

3.找到自己已经下载好的Chrome离线安装文件xxx.crx，然后将其从资源管理器中拖动到Chrome的扩展管理界面中，这时候用户会发现在扩展管理器的中央部分中会多出一个”拖动以安装“的插件按钮。

4.松开鼠标就可以把当前正在拖动的插件安装到谷歌浏览器中去，但是谷歌考虑用户的安全隐私，在用户松开鼠标后还会给予用户一个确认安装的提示。

5.用户这时候只需要点击添加按钮就可以把该离线Chrome插件安装到谷歌浏览器中去，安装成功以后该插件会立即显示在浏览器右上角（如果有插件按钮的话），如果没有插件按钮的话，用户还可以通

过Chrome扩展管理器找到已经安装的插件。

方法二：文件夹格式插件安装

1.首先用户点击谷歌浏览器右上角的自定义及控制按钮，在下拉框中选择设置。

2.在打开的谷歌浏览器的扩展管理器最左侧选择扩展程序。

3.勾选开发者模式，点击加载已解压的扩展程序，将文件夹选择即可安装插件。

更新日志：

-- New in version 1.0.4

* Update Augury to Angular 2.0.0-rc.4.

* Included support for the **Component Router**, while retaining support for deprecated router.

* Fix a bug where inputs and outputs where not shown when @Input/@Output were being used.

* Fix a bug where theme menu did not match current theme.

-- New in version 1.0.3

* Augury supports projects written in Angular 2.0.0-rc.3.

* Update Augury to Angular 2.0.0-rc.3.

* Fix a bug where graph colors in "Router Tree" where not matching the dark theme.