步骤二:引入electron-vue项目中 打包完成后复制/shells/chrome整个文件夹,粘贴到你的electron-vue项目根目录,可以改个文件夹名字,比如我改成了 “.devtools”。如果不想上传这个文件夹的内容到远程仓库,则在项目里的.gitignore中添加.devtools即可 .devtools文件夹里的内容如下图所示: 步骤三:在代码中引入 接下来,...
2. 项目开发模式运行出现 Failed to fetch extension 警告 由于网络问题, 开发模式无法下载 vue devtool 导致的警告, 需要在 background.js 中注释掉下载代码 image.png 3. 项目使用本地的vue devtools ① 首先可以将vue devtools的代码clone下来, 然后进行编译 代码语言:javascript 代码运行次数:0 运行 AI代码解释...
获取Vue.js devtools在电脑中的安装位置 按上述建议方式安装的插件位置是在Chrome安装位置里面的,下图是我的路径 使用BrowserWindow.addDevToolsExtension(extension)API 这是electron官网对BrowserWindow.addDevToolsExtension(extension)API的使用介绍,简单来说就是在electron的主进程main.js中使用API,唯一参数为插件路径,上图...
在Electron 中使用Vue Devtools ·首先在Chrome中安装Vue Devtools; ·在Chrome中打开扩展程序,并且开启开发者模式,这样就可以获取扩展程序的ID,记住这个ID ·在Electron应用中添加如下代码: main/index.js if (process.env.NODE_ENV !== 'development') { global.__static = require('path').join(__dirname, ...
安装完成后我们就可以在主线程入口文件中添加如下代码:BrowserWindow.addDevToolsExtension('node_modules/vue-devtools/vender') 注意上面的路径,你直接写"node_modules/vue-devtools"这个是不行的,应为插件的入口在它下面的"vender"目录下面。还有一点要小心:上面的代码必须在ready事件之后或者直接写在ready事件里面,不然...
当Electron使用Vue框架时,势必在调试过程要使用vue-devtools: 在我们调试Electron时,上图中Vue这个tab栏并不是天生自带的,需要我们去加载相应的插件。百度搜一下,有很多关于安装vue-devtools的文章,我也兴奋得下载源码(5.1.1版本源码)、编译、安装,然后electron中加载。启动Electron后,打开调试器,倒是有vue这一栏,但是...
但本人希望能在electron中使用并调试Vue，然而Electron似乎并不支持安装…看electron中Unable to install `...
npm install @vue/cli -g 安装Electron 使用如下命令安装Electron插件。 npm install -g electron 或者 cnpm install -g electron 为了验证是否安装成功,可以使用如下的命令。 electron --version 创建运行项目 Electron官方提高了一个简单的项目,可以执行以下命令将项目克隆到本地。
① 首先可以将vue devtools的代码clone下来, 然后进行编译 git clone https:///vuejs/vue-devtools.gitcd vue-devtools npm install npm run build复制代码 1. 2. 3. 然后把vue-devtools/packages/shell-chrome文件夹复制到项目根目录 ②在background.js文件的app.on('ready',生命周期中进行加载 ...
console.error('Vue Devtools failed to install:', e.toString()) } } createWindow() }) 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 加入vue-devTools 成功.。 就这样就可以调试了,具体配置看官网Demo