✅ Deploy Preview for vue-devtools-docs canceled.

There are many code about the useDevToolsColorMode but I don't how to fix them.

Open in Stackblitz

npm i https://pkg.pr.new/@vue/devtools-applet@737

npm i https://pkg.pr.new/@vue/devtools-core@737

npm i https://pkg.pr.new/@vue/devtools@737

npm i https://pkg.pr.new/@vue/devtools-api@737

npm i https://pkg.pr.new/@vue/devtools-kit@737

npm i https://pkg.pr.new/vite-plugin-vue-devtools@737

commit: e26863a

Hi, that's related to #339

The inspect page is hosted as an injected iframe, so the dark/light logic is strictly isolated from devtools page. They "can" work properly because they share the same dark class name in the html tag.

I think this is a vueuse side bug, so I believe the proper solution is to hide the theme toggle button on the inspect page. /cc @webfansplz , WDYT?

WDYT

OK~
See the history issues, I get the background.

For the first time, I want to update the vite-plugin-inspect vite plugin and add an option to hide the Dark Mode button.
But! It's too hard because the plugin client part is a static source. The option can't be passed to the client content.

This is a tricky question.

@alexzhang1030

@alexzhang1030 @webfansplz

antfu-collective/vite-plugin-inspect#123

I submitted a PR to vite-plugin-inspect. After understanding the background, my current plan is to add a hideDarkMode configuration option to vite-plugin-inspect. This way, the theme toggle button for the inspect module can be disabled in DevTools.
I believe this is the best solution for now.