win10下vuedevtools的装置和运用

网上关于vue-devtools的装置不可胜数，然则本身操纵起来却老是遇到问题。

写下这篇漫笔，以防今后遗忘。

vue-devtools是一款基于chrome游览器的插件，用于调试vue运用，这能够极大地进步我们的调试效力。固然网上教程确实多，很轻易明白，然则新手操纵着实会卡住。

这里引见一篇，人人能够去看看https://blog.csdn.net/zhousen&＃8230;。

我这里写下我装置的全过程，以及走过的弯路，及解决办法。

要领一：

chrome市肆直接装置
vue-devtools能够从chrome市肆直接下载装置，异常简朴，这里就不过量引见了。不过要注重的一点就是，须要FQ才下载。

要领二：（重要讲要领二）

一、下载chrome扩大插件
GitHub下载地点：

https://github.com/vuejs/vue-&＃8230;
这个下载的话：

下载zip花样的文件

二、解压到当地

记得看清楚文件的目次，等会须要接见到此目次，固然你也能够解压在c盘，不发起什么东西都往c盘扔；

三、win+r 输入 cmd 翻开敕令行操纵
为了轻易新手，cmd也敲出来；

像许多操纵都是cnpm install，npm install ，npm run build等操纵；等下再引见，先进入我们解压文件的目次：

进入后输入 cnpm install；能够看下，会有毛病，固然假如你下载了npm，cnpm，天然不会报错；

之前卡这里良久，随处找，没有找到，毕竟新手。

npm：node.js下的包治理，下载node.js 会附带npm。然后我又跑去找node.jsde的下载要领。引见人人能够去看这个

node.js下载博客：

https://www.cnblogs.com/goldl&＃8230;
node.js的下载网址：

http://nodejs.cn/download/
因为我的电脑是64位的windows体系；

下载完成后，双击装置

一起next，到了装置目次后，默许C盘，（发起改成D盘，本身新建的目次）

我的是D盘，nodejs，选好后点击next。

这里须要重要，点击add to path,不须要设置环境，不然又得去操纵环境设置，另有这边下载装置完成后，不要随意转变文件夹，不然得从新设置环境变量。。。。。点击next，install，finish。。。

下载完成后会在你的文件夹有：谁人.msi是我之前下的，能够删除

如今能够去操纵npm 了，记得从新翻开敕令行，起首检察环境变量，会发明自动配好了node，和npm，你会发明如今两个竟然不在同一个文件夹

输入node -v ，npm -v能够检察适才下载的node，npm的版本；注重不要遗忘输入空格。

如今只是装置了npm，另有cnpm须要装置

输入这个敕令： npm install -g cnpm &＃8211;registry=https://registry.npm.taobao.org

输入： cnpm -v 搜检版本，

四、cnpm install，npm run build 等操纵
如今我们能够回到vue-devtool的下载了。。。。。。记得须要进入本身下载解压文件的位置

虽然我也不晓得是在干啥，然则我晓得应该是胜利了：

时候有点长，须要耐烦等一等。。。。

cnpm install操纵完成后举行npm run build

完成后显现：

然后进去到文件夹内，一定是shells下的chrome的manifest.json文件，

进入当地编辑器，做如下图修正，false 改成 true

五、扩大Chrome插件
翻开chrome浏览器，翻开设置>点击或许顺序>点击开发者形式>加载已解压的扩大顺序