vue electron 下载Vue-devtools ChromeExtension扩展失败

晶格点阵

已于 2022-07-26 11:41:07 修改

阅读量2k

点赞数

CC 4.0 BY-SA版权

分类专栏：技术开发经验笔记文章标签： electron 前端 javascript

于 2022-07-26 11:28:31 首次发布

本文链接：https://blog.youkuaiyun.com/zxstrive/article/details/125989700

技术开发经验笔记专栏收录该内容

28 篇文章 ¥79.90 ¥99.00

订阅专栏

超级会员免费看

在尝试使用npm run electron:serve时，遇到了Vue Devtools扩展下载失败的错误，错误提示为net::ERR_CONNECTION_TIMED_OUT。常规解决方案是注释掉安装扩展的代码，但这并不适用。通过分析`electron-devtools-installer`的源码，发现扩展通过fileURL从谷歌下载，由于网络问题无法成功。解决办法是手动下载Chrome扩展ID为ljjemllljcmogpfapbkkighbhhppjdbg的文件，并将其放入指定的filePath。完成这一操作后，Vue Devtools成功安装。

npm run electron:serve，报错信息如下：

Failed to fetch extension, trying 4 more times
Failed to fetch extension, trying 3 more times
Failed to fetch extension, trying 2 more times
Failed to fetch extension, trying 1 more times
Failed to fetch extension, trying 0 more times
Vue Devtools failed to install: Error: net::ERR_CONNECTION_TIMED_OUT

网上大部分的解决方案下：

app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    // Install Vue Devtools
    try {
      // await installExtension(VUEJS3_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  createWindow()
})

注释掉，await installExtension(VUEJS3_DEV

了解本专栏

超级会员免费看