Production 打包输出的Vue项目怎样使用Vue Devtools了?
第一步：
我们用掘金的页面走一波，首先得到Vue类，一般来说Vue的源码都被打包到了vendor.xxx.js文件中。我们可以这样得到Vue类。
- 我们打开chrome 开发者工具，找到这个文件，然后搜索
prototype.$nextTick， - 在搜索的代码上打上断点，然后刷新页面
- 在控制台中保存Vue 类
看图：
第二步：
- 在console中执行代码
vv.config.devtools=true;__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', vv); - 关闭console 然后重新打开，我们可以看见在chrome 的devtool 多了一个Vue Tab
- 这个时候就可以使用Vue Devtools了，如果看见的是一片空白，请继续走下面的步骤
第三步：
- 找到Vue挂载的Dom根节点，一般都是
app节点 - 在Vue Devtools的backend.js中找到
t.childNodes这一行代码，打断点 - 在Vue Devtools调试面板中点击刷新按钮
- pause在断点处，然后在控制台中执行
t=app; - 放开断点，让代码继续执行，好了现在你可以在Vue Devtools里面看到组件了
看图：
总结：
这个流程有一点复杂，一般没有什么用，但是如果你的项目在正式服务中有BUG，或者某些服务本地开发无法模拟，碍于特殊的数据环境，又苦于production的Vue项目不能使用调试，你可以用这个方法来快速的定位问题，Have a fun time!
