Franz Electron + React 源码启动运行填坑指南

环境要求

  1. 安装miniconda python 环境@electron/rebuild用得着,miniconda 默认自带的 python 是 3.11 版本,比较新;

  2. 安装virsual studio 2019 要把C++桌面相关的都安装了,大概需要20G,不要安装到 C 盘,都安装到其他盘去;

运行步骤

  1. Franz原始代码,因为需要运行 lerna,所以需要 python 环境是 python2.7,因为 package-lock.json 的原因,第一次运行时绕不开,删掉 package-lock.json 可能有其他问题;

  2. 另外就是 package.json 把electron-rebuild 库更换为@electron/rebuild: 3.6.0 的库,这个库改名了,旧库依赖的 node-gyp 版本太低,只能用 python2.7,而 conda 虚拟环境下的 python2.7 可能有点问题;

  3. 接着就是全局再安装一遍@electron/rebuild: 3.6.0 npm install  @electron/rebuild@3.6.0 -g,重构建时在默认环境下执行; 

下面是 conda 创建 python2.7 环境的命令

# python2.7 conda 创建和使用方式
conda create -n py27 python=2.7
conda activate py27
  1.  还需要配置全局msvs_version版本号为2019,否则 npm run 时找不到具体的 vs 库

# 这样设置 node-gyp 才能找到vs版本 建议vs版本不要放在C盘 内容太大
npm config set msvs_version 2019 --global
  1. 一切就绪后,采用命令切换到 python2.7 环境,然后运行npx lerna bootstrap,如果不切到 python2.7 环境,则会报rU问题,这个是 python2.7 语法问题

    1. 必须用conda 切换到python2.7环境 conda activate py2.7,然后再运行上面的安装依赖命令

    2. 运行npx lerna run build,来构建UI子包,否则你运行npm run start,本地是没有内容的,这非常重要,运行完毕后,你会看到 packages.forms/theme/ui 文件夹下多出来一个 lib 文件夹,这个会被用到,没有这些内容,Franz 的渲染进程无法执行,你也看不到登录界面,之前我在这里卡了很久

  1. 等第一次npx lerna bootstrap运行完后,安装包就会正常安装,如果你这时再在 py27 环境运行这段话,就会报以下问题,如果还想再运行这个命令,直接重开一个 Terminal,在里面运行npx lerna bootstrap

  1. 经过上面的倒腾,你只需要在一个终端里npm run dev,来打包渲染进程的 react 代码,并实现热更新,另外再打开一个终端,运行npm run start就能启动 Franz 了,这个跟我们 electron-vue 有区别,electron-vue 只是把两个命令用 runner.js 合二为一了,但是我觉得这样更好,逻辑解耦性较强

其他须知

  1. lerna 是将多个项目代码放在一个代码库里,可以通过搭建私服来管理多个库,B站有课,这个也是我们未来探索的一个方向,进一步按照 Franz 的方式将我们的代码进行解耦和隔离

  2. npx lerna run build后,你会发现packages.forms 下多了node_modules和lib两个文件夹

  3.  全局安装@electron/rebuild: 3.6.0,可以在多个 Electron 代码里进行 node-modules 库重建 

npm install -g @electron/rebuild@3.6.0
npx electron-rebuild
  1. Franz通过router方式共用了登录和主界面的窗口,没有额外创建窗口,这种方式我们也可以借鉴

  2. .npmrc 文件里最好配置上两个镜像,以加快 builder 二进制库的下载,这里其实你还能看到注释掉的 python 版本要求就是 2.7

ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/
ELECTRON_BUILDER_BINARIES_MIRROR=https://npmmirror.com/mirrors/electron-builder-binaries/

运行说明

  1. npm run start 主进程不打印日志,这是因为默认electron命令会忽略console.log的输出,可通过配置环境变量开启,我是直接通过&&将这个设置放到了 start 命令里了,如 set ELECTRON_ENABLE_LOGGING=1 && electron --inspect=5858 ./build 这样启动,就可以打印详细日志

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/12463.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Rust处理命令行参数

概述 为了让我们的程序接收一系列数值作为命令行参数并打印出它们的最 大公约数,可以将 src/main.rs 中的 main 函数替换为以下内容: use std::str::FromStr; use std::env; fn main() {let mut numbers Vec::new();for arg in env::args().skip(1) {…

第八十一章 将 Web 应用程序与远程 Web 服务器结合使用 - 如果从 Web 服务器提供静态文件

文章目录 第八十一章 将 Web 应用程序与远程 Web 服务器结合使用 - 如果从 Web 服务器提供静态文件如果从 Web 服务器提供静态文件配置 Web 服务器路径将虚拟目录添加到 IIS将别名添加到 Apache 配置 第八十一章 将 Web 应用程序与远程 Web 服务器结合使用 - 如果从 Web 服务器…

【C++】认识C++(上)

目录 从C到C命名空间同名冲突命名空间的定义命名空间的使用 C的输入和输出缺省参数(默认参数) 从C到C C语言的出现是计算机科学和工程史上的一个重要里程碑,许多现代计算机语言都受C语言的影响。C语言是面向过程的,结构化和模块化…

梯度下降算法要点和难点具体应用

梯度下降算法(Gradient Descent Algorithm)是一种常用的优化算法,用于求解机器学习和深度学习中模型参数的最优解。其基本思想是通过迭代的方式,不断地沿着函数梯度的反方向更新参数,从而逼近函数的最小值点(或最大值点,取决于问题是求最小值还是最大值)。 以下是梯度下…

PostgreSQL的表空间

PostgreSQL的表空间 基础信息 OS版本:Red Hat Enterprise Linux Server release 7.9 (Maipo) DB版本:16.2 pg软件目录:/home/pg16/soft pg数据目录:/home/pg16/data 端口:5777在 PostgreSQL 中,表空间&…

力扣HOT100 - 279. 完全平方数

解题思路&#xff1a; 动态规划 class Solution {public int numSquares(int n) {int[] dp new int[n 1];// 初始化dp数组&#xff0c;默认最坏情况是每个数都是由1相加得到的for (int i 1; i < n; i) {dp[i] i;}for (int i 1; i < n; i) {for (int j 1; j * j &…

Python Twisted库:异步网络编程的利器

更多Python学习内容&#xff1a;ipengtao.com 在现代网络应用开发中&#xff0c;异步编程已经成为一种必备的技能。Python Twisted库是一款强大的异步网络编程框架&#xff0c;它提供了丰富的工具和功能&#xff0c;使得开发者可以轻松地构建高性能的网络应用。 基本概念 Twist…

在虚机VirtualBox7.0.8安装Androidx86_64系统详细步骤要点

最近需要用到安卓系统蓝牙功能做测试&#xff0c;就选择了Virtualboxandroidx86方案&#xff0c;先把系统安装好&#xff0c;后面看是否可以比较好的完成蓝牙功能测试。如果可以的话&#xff0c;我会再发文分享下的&#xff0c;敬请期待。 1.准备材料 &#xff08;1&#xff…

【aws】amazon linux使用密码登录或者root登陆

amazon linux ssh 使用密码登录 设置好安全区组规则后0.0.0.0/0,或者想安全就指定aws的ip,如果多个安全组都有绑定&#xff0c;多个安全组打开 1、使用AWS控制台创建的密钥对或者建议直接通过网页登录 注意&#xff1a;使用pem私钥不允许直接登录root用户&#xff0c;只能登…

Python API和微服务的测试库之httpretty使用详解

概要 在现代软件开发中,API和微服务的测试是确保应用稳定性和功能正确性的关键环节。Python的HTTPretty库提供了一个强大的工具,允许开发者在不实际发起网络请求的情况下模拟HTTP请求和响应。本文将全面介绍HTTPretty的安装、特性、基本与高级功能,并结合实际应用场景,展示…

企业如何利用美国多IP服务器来提升网站的安全性?

企业如何利用美国多IP服务器来提升网站的安全性? 在当前网络环境下&#xff0c;网站安全性日益成为企业面临的重要挑战。为了有效应对各种潜在威胁&#xff0c;越来越多的企业选择利用美国多IP服务器来提升其网站的安全性。这种服务器配置能够通过一系列策略来增加网站的安全…

5G NR 吞吐量计算 and 4G LTE 吞吐量计算

5G NR Throughput References • 3GPP TS 38.306 V15.2.0 (2018-06) ➤J : number of aggregated component carriers in a band or band combination ➤Rmax : 948/1024 • For the j-th CC, Vlayers(j) is the maximum number of layers ➤Qm(j) : Maximum modulation orde…

视频推拉流/视频直播点播平台EasyDSS使用Mysql数据库接口报错502如何处理?

视频推拉流/视频直播点播EasyDSS互联网直播平台支持一站式的上传、转码、直播、回放、嵌入、分享功能&#xff0c;具有多屏播放、自由组合、接口丰富等特点。平台可以为用户提供专业、稳定的直播推流、转码、分发和播放服务&#xff0c;全面满足超低延迟、超高画质、超大并发访…

meshlab: pymeshlab合并多个物体模型并保存(flatten visible layers)

一、关于环境 请参考&#xff1a;pymeshlab遍历文件夹中模型、缩放并导出指定格式-CSDN博客 二、关于代码 本文所给出代码仅为参考&#xff0c;禁止转载和引用&#xff0c;仅供个人学习。 本文所给出的例子是https://download.csdn.net/download/weixin_42605076/89233917中的…

计算机视觉——OpenCV实现Lucas-Kanade 光流追踪

1.光流 光流法是计算机视觉中用于估计图像序列中物体运动的关键技术。它类似于观察夜空中的彗星&#xff0c;通过其在天空中的运动轨迹来追踪它的路径。在图像处理中&#xff0c;光流帮助我们理解像素点如何在连续的帧之间移动。 1.1 稀疏光流法 稀疏光流法关注于图像中的关…

tarjan学习

1.割点&#xff08;必须经过&#xff09;&#xff1a;当时&#xff0c;y是一个割点&#xff0c;x是y的一个子节点&#xff0c;当没有点x时&#xff0c;y无法访问其他点 2.割边&#xff08;必须经过&#xff09;&#xff1a;当时&#xff0c;y不经过这条边无法到达x&#xff0c…

默认成员函数:析构、深浅拷贝

析构函数 析构函数&#xff1a;与构造函数功能相反&#xff0c;析构函数不是完成对对象本身的销毁&#xff0c;局部对象销毁工作是由编译器完成的。而对象在销毁时会自动调用析构函数&#xff0c;完成对象中资源的清理工作。 特性 析构函数名时在类名前面加上字符~ class D…

Spring Bean的生命周期 五步 七步 十步 循序渐进

&#x1f468;‍&#x1f3eb; 参考视频地址 &#x1f496; 五步版 实例化 bean&#xff08;构造方法&#xff09;属性注入&#xff08;set() 方法&#xff09;初始化方法&#xff08;自定义&#xff09;使用bean销毁方法&#xff08;自定义&#xff09; &#x1f496; 七步版…

电子招标软件:招标提案请求(RFP)流程的步骤

招标提案请求&#xff08;RFP&#xff09; &#xff0c;可能不是评估专业能力和复杂解决方案的最佳方法&#xff0c;但仍然是产品或服务招标时的首选方法。 如果管理得当&#xff0c;招标采购过程将会是透明、客观和公正的。一份精心制作的 RFP 文件可以确定提交材料的质量、基…

linux的 /usr/sbin/nologin /sbin/nologin /bin/false /etc/nologin 的作用与区别

/usr/sbin/nologin /sbin/nologin /bin/false /etc/nologin 的作用与区别 /usr/sbin/nologin /sbin/nologin /bin/false 这三者的作用几乎一样&#xff0c;都是禁止用户登录。 /usr/sbin/nologin /sbin/nologin 是同一个文件&#xff0c;通过软连接指向。 当把用户的bash设置…