Vue调试神器vue-devtools - 插件下载&&安装

Google如何安装调试Vue的神器vue-devtools ?

---

---

安装介绍：

下面介绍一下该调试插件的下载&&安装办法：

demo实例 - 演示代码:

首先，新建一个html文件，代码随意如下：

	
		
		
	
	
		

			
 {
    {message}} 
			
		
	
		
		
	

Google浏览器F12查看Console信息；
之后，按照下图所示，点击链接 https://github.com/vuejs/vue-devtools

接着会进入如下页面：

找到上图中所示的链接 Get the Chrome Extension (beta)，点击后，进入下面的页面：

点击安装之后，如上图所示。

此时，就完成了插件的安装了。

---

相关文章链接：

1. https://github.com/vuejs/vue-devtools

2. https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

3. 手动安装教程

Vue调试神器vue-devtools安装

• 第一步： 找到vue-devtools的github项目，并将其clone到本地. vue-devtools
  git clone https://github.com/vuejs/vue-devtools.git
• 第二步： 安装项目所需要的npm包
  npm install //如果太慢的话，可以安装一个cnpm, 然后命令换成 cnpm install
• 第三步： 编译项目文件
  npm run build
• 第四步： 添加至chrome游览器

游览器输入地址“chrome://extensions/”进入扩展程序页面，点击“加载已解压的扩展程序...”按钮，选择vue-devtools>shells下的chrome文件夹。

/**
*如果看不见“加载已解压的扩展程序...”按钮，则需要勾选“开发者模式”。
*/

---

以上就是关于“ Vue调试神器vue-devtools - 插件下载&&安装 ” 的全部内容。