Electron+Vue的环境配置

1.第一个坑是网络问题,装electron的包装不上,提示网络问题,源换了无数次,tz开了关关了开仍然不行。最后找出了解决办法。
(165条消息) 使用原生vue搭建electron常见报错_barzar的博客-CSDN博客
我遇到主要问题是
vue add electron-builder的时候他不能正常运行,提示网络错误,其大体的解决方案为npm config edit然后在这里面添加下面代码。

electron_mirror=https://npm.taobao.org/mirrors/electron/
electron-builder-binaries_mirror=https://npm.taobao.org/mirrors/electron-builder-binaries/

完美解决,以后装electron的包也很方便,归根结底还是换源其实。

2.然后装完后又遇到了第二个问题,运行的时候给我报错this[kHandle] = new _Hash(algorithm, xofLen);查询发现是node.js的新版本的问题,node.js V17版本中最近发布的OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制,可能会对生态系统造成一些影响。
解决方法有两个一个降级另一个是在运行前加上SET NODE_OPTIONS=--openssl-legacy-provider其大致意思为运行的时候设置NODE_OPTIONS的路径,设置完后便可以运行了?吗?
并没有,弹出一个信息electron: --openssl-legacy-provider is not allowed in NODE_OPTIONS找了一圈后发现他们的答案是取消配置NODE_OPTIONS,额。
在微软的社区发现了一个已经解决的答案,彻底让我放弃折腾的心,他的解决方案是降级node.js,没办法降级,然后降级到node.js 16.9便好了。
大致就是遇到了这两个坑。如果看到这篇文章,我建议装electron+vue的环境前可以先考虑一下,或许…装个node.js 16.9?

新人第一次写文章,可以点个赞的话是极好的。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
Electron Vue 项目中,当我们使用 iframe 标签来嵌入其他网页时,有时会出现跨域问题。这是因为 Electron 应用默认是禁止跨域请求的,为了解决这个问题,我们可以进行以下操作: 1. 在项目的主进程中的 main.js 文件中,添加以下代码来启用跨域请求: ```javascript const electron = require('electron') electron.webContents.allowRendererProcessReuse = true app.commandLine.appendSwitch('disable-features', 'OutOfBlinkCors') ``` 这样,我们就可以解决 electron 的跨域请求问题。 2. 如果还是无法解决跨域问题,我们可以在 vue.config.js 文件中进行配置。在 devServer 配置下增加以下代码: ```javascript devServer: { proxy: { '/api': { target: 'http://localhost:3000', ws: true, changeOrigin: true } } } ``` 这样,在开发环境下,我们将所有以 '/api' 开头的请求都代理到我们指定的 target 地址上,解决跨域问题。 3. 如果以上两种方法都无效,我们还可以在 Electron 的主进程中使用 session 来禁用 webSecurity,代码如下: ```javascript const { app, BrowserWindow } = require('electron') app.on('ready', () => { const mainWindow = new BrowserWindow({ webPreferences: { webSecurity: false } }) }) ``` 这样,我们就可以通过禁用 webSecurity 来解决 Electron 的跨域问题。 需要注意的是,这些解决方法只适用于开发环境和本地调试阶段。在最终打包发布 Electron Vue 项目时,需要遵循 Electron 的安全策略,并且谨慎处理跨域问题,以确保项目的安全性和稳定性。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Jrenc

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值