Closed TheAutomaTom closed 1 year ago
This is happening on my side. I change the installer to use a local one, and adjusted the show code of devtools. Now I get 95% of success chance of it.
@Tanimodori are you describe "not using the extension?" I notice v3.2.0 has been released for 2 years. This is really my first experience with electron or that package... I wonder where the fault is?
Yup, no extension works fine! Electron's docs outline an easy path to success. I'm sure the extension adds some convenience... but it's not working.
This should work. module.default.default
🤯🤔
if (import.meta.env.DEV) {
app
.whenReady()
.then(() => import('electron-devtools-installer'))
.then(module => {
console.log(module);
return module.default.default(module.default.VUEJS3_DEVTOOLS, {
loadExtensionOptions: {
allowFileAccess: true,
},
});
})
.catch(e => console.error('Failed install extension:', e));
}
Same issue as here, I assume
@cawa-93 For that auto updater issue, as long as you set esModuleInterop
to true
in tsconfig, it will be resolved.
@cawa-93 For that auto updater issue, as long as you set
esModuleInterop
totrue
in tsconfig, it will be resolved.
But it did't fixed this issue. 🤔 Ok. Maybe auto updater issue is't relevant to this
I personally loads the extension from locally installed Chrome extension dir:
if (import.meta.env.DEV) {
app.whenReady().then(() => {
if (!process.env['APPDATA']) {
throw new Error('Could not load extensions from local');
}
const extPath = join(
process.env['APPDATA'],
'../Local/Google/Chrome/User Data/Default/Extensions/nhdogjmejiglipccpnnnanhbledajbpd',
);
const extVersions = readdirSync(extPath);
const VUE_DEVTOOLS_PATH = join(extPath, extVersions[0])
session.defaultSession.loadExtension(VUE_DEVTOOLS_PATH, {
allowFileAccess: true,
});
});
}
More info: https://github.com/vuejs/devtools/issues/2035#issue-1628803550
I found the same issue when I was installing Redux Dev Tools. For some reason the default import from electron-devtools-installer
wasn't working as I expected. I had to reference the default
directly:
import installExtension, { REDUX_DEVTOOLS } from "electron-devtools-installer";
app.whenReady().then(() => {
((installExtension as any).default as typeof installExtension)(REDUX_DEVTOOLS)
.then(name => console.log(`Added Extension: ${name}`))
.catch(err => console.log("An error occurred: ", err));
});
@acurrieclark Your issue is a duplicate of https://github.com/vitejs/vite/issues/2139, which is caused by diffrent default export path between commonJs and ESM. You can turn on TS esModuleInterop
flag to automatically do the default export unwrap for you.
@Tanimodori thats really good to know! Thank you
Hi! I managed to solve this issue by using the solution found in this comment. Turns out you have to manually set the extension ID. I still however get the error about the extension working on manifest v2 and not v3. Vue devtools has a working manifest v3 fork however I don't know how to use it here. Would be nice to update the template with a fix for this and using manifest v3 fork.
Describe the bug
electron-devtools-installer
'sVUEJS3_DEVTOOLS
extension does not load.To Reproduce Steps to reproduce the behavior:
packages\main\src\index.ts
npm i electron-devtools-installer
(also tried as dev dependency)npm i
ctrl+shift+P
=>Reload developer window
to remove error at import statement.F5
ornpm run watch
Failed install extension: TypeError: installExtension is not a function.
"Expected behavior No error reported in the terminal, and devtools would display a "
Vue
" tab.Additional context I notice that going to the definition of
electron-devtools-installer
only shows a function namedintall()
. Changing the call to this didn't solve the problem. The packages' docs say to useinstallExtention()
. I have not tried with any other dev tools, as I only use Vue 3.I was installing
electron-devtools-installer ^3.2.0
, but after seeing v3.2.0 is labelled "build: failing," I rolled back to versions 3.1 and 3.0, with no positive result.