调试工具vue-devtools 安装
vue-devtools 安装可从GitHub下载源程序编译,以插件的形式安装chrome 浏览器。
安装步骤:
新建文件夹,并运行下列语句;
git clone https://github.com/vuejs/vue-devtools
cd vue-devtools
git checkout master
npm install
npm run build
注意:从github 拉取代码后 需切换到分支 master ; 否则,会在 执行 npm run build 命令时 报错: Cannot find module '@vue-devtools/build-tools’
扩展Chrome 插件
vue-devtools 项目编译生成成功后,可通过 打开Chrome浏览器 >选择更多工具>扩展程序 >打开开发者模式,
点击加载已解压的扩展程序, 找到刚才生成的chrome文件夹,选择 vue-devtools > shells > chrome 放入,
安装成功:
vue源代码调试
启动vue项目,打开浏览器,点击sources,查看项目源文件;
其中标红的部分为vue源程序 ,可添加断点,调试代码;