可能是NextJs(使用ssr、api route)打包成桌面端(nextron、electron、tauri)的最佳解决方式
前言
在我使用nextron(next+electron)写了一个项目后打包发现nextron等一系列桌面端框架在生产环境是不支持next的ssr也就是api route功能的这就导致我非常难受,耗费了小半个月结果告诉我只能使用NextJs的单页面模式也就是静态导出模式(因为在开发环境是支持ssr/api route的就导致我以为可以使用)这让我无法理解nextron的意义,我认为api route是NextJs作为全栈框架非常重要的功能,阉割后只能算作react plus,于是不甘心的我就开始在网上查找解决方案。
经历
>> 我在github找到了几个自称是可以在next+electron中使用ssr/api route的代码模板,但是在我不断的是错后得出这些代码模板或多或少都有问题,并不能正常打包,唯一一个让我打包成功的显示next-auth没有生效,询问作者怎么解决,作者告诉我:他不知道,这只是一个模板需要我自己去debug(流泪)。
>>为什么我不抛弃api route使用NextJs(csr)+其他后端?因为我使用了next-auth,这与我的项目不可分割,并且next-auth与api route是绑定的。再者我使用NextJs的缘由就是因为其api route能让我快速搭建全栈项目,若是阉割我还不如不用NextJs直接使用react。
>>之后我打算将NextJS的csr与ssr部分分开,在服务端部署ssr部分,桌面端打包csr部分,然后通过在网页端登录获取个人的_id,然后通过_id登录桌面端(将登录功能分割到网页端),但是依旧失败,因为next-auth要求ssr+csr绑定,如果分割只能去掉next-auth。
>>就在我准备使用下下策:将nextron中的NextJs部分提取成网页然后通过iframe(iframe真的很垃圾,是没有办法的办法)嵌套在electron中进行打包的时候它出现了:
tw93/Pake: 🤱🏻 Turn any webpage into a desktop app with Rust. 🤱🏻 利用 Rust 轻松构建轻量级多端桌面应用
Pake:一款基于Rust语言和Tauri框架的桌面应用开发框架,可以将网页内容转化为小巧玲珑的桌面应用。
它可以将任何网页直接打包成桌面端,所以我们只需要将NextJs部署然后通过Pake打包即可
省流
Pake的部署及其简单,你只需要以下几步:
-
安装rust
直接去官网安装,点击exe安装时会出现选项,一直选择1即可,实在不会网上教程也很多随便找一个就行。
-
打开你的管理员终端输入:
npm i -g pake-cli
安装依赖,这边不建议使用淘宝镜像,因为我使用淘宝镜像出现了问题。
-
安装成功后输入:
pake url —name yourname
url就是你想打包的网页的网址,而yourname是你想给你应用起的名字。
成功之后会显示打包应存储的路径,找到路径打开安装即可。
最后的最后,感谢Pake!!!