Deluze / electron-vue-template

Simple Vue3 + Electron starter template in TypeScript, including ViteJS and Electron Builder
MIT License
534 stars 104 forks source link

Add vue devtools. #34

Open frankperez87 opened 1 year ago

frankperez87 commented 1 year ago

This adds Vue Devtools support.

One thing to note is that you will get a warning stating: Manifest version 2 is deprecated, and support will be removed in 2023.

This is already being addressed within the vuejs devtools repo here https://github.com/vuejs/devtools/issues/1917

Deluze commented 1 year ago

Thanks for this PR!

I would like to merge this, but I'm running against some errors locally:

[electron] [38620:1124/235749.957:ERROR:CONSOLE(160)] "Electron sandbox_bundle.js script failed to run", source: node:electron/js2c/sandbox_bundle (160)
[38620:1124/235749.957:ERROR:CONSOLE(160)] "TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))", source: node:electron/js2c/sandbox_bundle (160)

I'm not sure what causes this yet, but doing a quick google search it seems more people have ran into this issue. This error pops up on start, and more of them get logged after opening the Vue devtools.

Another issue is that the Content Security Policy header is blocking a request to a script that Vue Devtool is trying to load and execute... thinking of omitting the header and let the developers decide what they want to do with it.

[electron] [51244:1124/235652.437:ERROR:CONSOLE(0)] "Refused to load the script 'https://cdn.headwayapp.co/widget.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Deluze commented 1 year ago

I'm thinking that the remote vue devtools package might be a better (temporary) solution until these errors are fixed. Only downside is that the devtools is a separate process on the machine, at least the developer can then decide if they want to launch the devtools or not.