dec*_*dec 5 javascript debugging google-chrome vue.js
是否可以在Chrome中调试.vue组件。到目前为止，我只得到了橙色标记的源代码，而chrome没有记录调试信息，即无法检查变量等。
如何做到这一点？
是的，当然可以。
首先，您需要确保使用的是非缩小版本/非生产版本的Vue.js。您可以通过在控制台输出中查看开发工具来验证这一点。如果您的Vue版本是允许调试的开发版本，则您应该在控制台中看到以下消息。
You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
其次，您需要安装Vue.js Devtools插件。
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=zh-CN
注意：如果您不使用Web服务器，而只是在浏览器“ file：//somefile.htm”中加载本地文件，则需要进入chrome扩展和插件设置，并允许“允许访问文件URL”
第三，您可以打开“源映射”，具体取决于您的设置。如果您的项目只是使用CLI设置的，则找到您的config/index.js文件并将dev-tool属性设置为devtool: 'source-map'
如果您使用的是Webpack或Laravel混合，则可以使用.sourceMaps()Webpack配置文件中的方法启用源映射。也可能需要其他更改。 https://webpack.js.org/configuration/devtool/
| 归档时间： |
|
| 查看次数： |
4337 次 |
| 最近记录： |