MAC Google Chorme安装vue-devtools扩展程序
本机是Macbook pro 2018款,当前系统是Catalina,Google浏览器下安装vue-devtools拓展程序的步骤如下:
根据Vue.js的官方文档:Vue Devtools
Step1:
先要转到github上下载master分支下的vue-devtools这个包
(如果下载速度慢,小伙伴可以先用gitee Fork之后再下载,具体不在这里叙述了)
注意是matser分支
Step2:
修改 vue-devtools-master/shells/chrome/manifest.json 这个文件
第31行 将默认的flase改为true
(懒狗可以vim直接修改的 )
step3:
将vue-devtools-master这个文件 放到到Chorme的插件文件夹default中
/Users/lin/library/Application Support/Google/Chrome/Default
懒狗可以通过 mvdir 移动一下,或者在访达里面手动将那个修改完的vue-tools-master移到Default中
(Mac在finder中不太能找到这个文件夹,我也是根据网上大佬的这个路径,通过terminal一层一层cd打开的,不过一般都默认在这个文件夹中。 )
step4:
打开你的终端 输入cd 把这个vue-devtools-master文件拖进去
或者直接输入
cd ~/library/Application\ Support/Google/Chrome/Default/vue-devtools-master/
运行第一行(sudo的话会提示你输密码的 尽量用cnpm )
sudo cnpm i
运行第二行()
npm run build
step5:
chorme浏览器输入
chrome://extensions/
把右上角的开发者模式打开
直接把Default目录下vue-devtools-master的shell目录下的chorme拖进来
注意 不要拖整个文件,不然会报清单文件缺失的。因为manifest这个文件在chorme这个子文件夹中,如果拖vue-devtools-master这个文件夹,是找不到这个json文件的;
最后就能和win一样显示了
最后
和win一样,右上角那个拼图点一下可以开起来
运行了最基本的helloworld.vue,F12调试