谷歌浏览器安装vuejs devtools 插件

1 . 下载chrome扩展插件。

在github上下载压缩包并解压到本地,github下载地址:https://github.com/vuejs/vue-devtools

2. npm install

下载完成后打开命令行cmd进入vue-devtools-master文件夹,

1. npm install,

  1. 安装依赖包;如果安装太慢,就先安装淘宝镜像,命令行输入 $ npm install -g cnpm --registry=https://registry.npm.taobao.org。

  2. 安装完成后可以测试是否安装成功:可输入命令:$ cnpm -v 返回版本号说明安装成功

  3. 现在就可以用 $ cnpm install
    谷歌浏览器安装vuejs devtools 插件_第1张图片

2.cnpm run build

谷歌浏览器安装vuejs devtools 插件_第2张图片

  1. 编译打包完后会在shells>chrome下的src文件夹里生产如上图所示的几个js文件;
    谷歌浏览器安装vuejs devtools 插件_第3张图片

3.扩展chrome插件

  1. 打开chrome浏览器,点击右上角,打开更多工具>扩展程序;
  2. 打开右上角的开发者模式。 再点击加载已解压的扩展程序,然后把shells>chrome文件夹放入
    谷歌浏览器安装vuejs devtools 插件_第4张图片
    谷歌浏览器安装vuejs devtools 插件_第5张图片
  3. 测试插件是否有效。运行Vue项目后 切换到Vue模式。
    谷歌浏览器安装vuejs devtools 插件_第6张图片

你可能感兴趣的:(开发工具整理)