Enable Vue devtools when running in farmOS

[braughtg]

Currently the Vue dev tools can be used when running in the dev server:

• Run: npm run dev:fd2
• Connect to: http://localhost:5173/fd2/tray_seeding
• Open DevTools
• Choose "Vue" in the top menu of the DevTools pane.

However, the Vue dev tools are not accessible when running the farmOS server:

• Connect to: http://farmos/fd2/tray_seeding
• Open DevTools
• Notice "Vue" is not available in the top menu of the DevTools pane.
• Click on the Vue icon at the top right of the browser and notice the message "Devtools inspection is not available because it's in production mode or explicitly disabled by the author."

Is there an easy way to enable the Vue DevTools when running inside of the farmOS server?

[JingyuMarcelLee]

It seems like the Vite production mode disables DevTool by default. I tried making changes to vite.config.js to enable vue devtool in production mode but it did not seem to work. There is an add-on on both Chrome and firefox called Vue-force-dev that force-enables vue devtool even under production mode. For firefox, it is available at https://addons.mozilla.org/en-US/firefox/addon/vue-force-dev/?utm_source=addons.mozilla.org&utm_medium=referral&utm_content=search Another option is to follow this tutorial and enable vue-devtool on the dev console. Both solutions worked.

[braughtg]

@JingyuMarcelLee Awesome find! I'm adding the Vue Force Dev to the development container so that it is installed into Firefox by default. I'll co-author you on the PR to the FarmData2-Images repo!

[github-actions[bot]]

:tada: This issue has been resolved in version 1.3.0-development.1 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket:

[github-actions[bot]]

:tada: This issue has been resolved in version 1.3.0 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: