为 Laravel Nova 启用 VueJS 开发工具答案

【问题标题】：Enable VueJS DevTools for Laravel Nova为 Laravel Nova 启用 VueJS 开发工具
【发布时间】：2019-04-30 07:29:25
【问题描述】：

我想检查 Laravel Nova（或自定义字段）的基本行为，并且我正在尝试启用开发工具。在右上角我可以看到 VueJS 的绿色图标，但是当我转到控制台时，没有 VueJS 的选项卡

如何启用它并检查所有组件？

干杯

【问题讨论】：

如果你点击 Vue Devtools 的图标，它会给你任何信息吗？您可能在生产模式而不是开发模式下编译 Vue。另外，我发现我随机需要隐藏然后再次显示控制台才能让 Vue 选项卡为我显示（在 Chrome 中）。
感谢您的提示！真正起作用的是重新启动 Chrome。现在我正在尝试自定义 nova 并查看其行为。

【解决方案1】：

您可以通过将Vue.config.devtools = true 添加到文件中来做到这一点：/nova/resources/js/app.js

确保导航到/nova 并运行npm run dev

最后重启你的 chrome。

注意：仅在您的本地环境中执行此操作，不要将其推送到生产服务器

【讨论】：

【解决方案2】：

试试这些步骤：

cd ./vendor/laravel/nova
mv webpack.mix.js.dist webpack.mix.js
npm i
npm run dev
rm -rf node_modules
cd -
php artisan nova:publish

【讨论】：

【解决方案3】：

通过将 Vue.config.devtools = true 添加到 MyComponent/resources/js/filed.js，devtools 可用。

关闭控制台并再次打开，确保您处于开发或观看模式。

【讨论】：