快速将aistudio build的网页打包为桌面应用

快速将aistudio build的网页打包为桌面应用
快速将aistudio build的网页打包为桌面应用

1 前言

aistudio build 可以让 AI 快速开发一些小工具,非常的方便,只需要不断提需求就行了,build 本身也有一些免费额度,也够用了

但是开发出来的网页,访问的话就需要能访问 aistudio 的网页,稍微有些不方便,毕竟工具的话还是离线使用比较好,于是我就想着有没有办法把网页放到本地来运行,又不想每次都输命令来启动网页

然后发现 tauri 可以通过几行命令将前端页面快速打包为桌面应用,对于 build 生成的网页完全够用了

2 执行步骤

2.1 安装 rust

先根据这几个链接安装好 rust 并配置好镜像,如果途中有什么问题直接问可以网页搜索的 AI 就可以了,我用的 z.ai 的 glm5.1,都给我解决了

先是下载 Rustup 并打开,如果发现下载速度很慢就得先配置 Rustup 的镜像

rust-lang.org

入门

一门帮助每个人构建可靠且高效软件的语言。

然后配置 Rustup 的镜像

mirrors.tuna.tsinghua.edu.cn – 8 May 26

Rustup | 镜像站使用帮助 | 清华大学开源软件镜像站 | Tsinghua Open Source Mirror

rustup 使用帮助 | 镜像站使用帮助 | 清华大学开源软件镜像站,致力于为国内和校内用户提供高质量的开源软件镜像、Linux 镜像源服务,帮助用户更方便地获取开源软件。本镜像站由清华大学 TUNA 协会负责运行维护。

然后配置 crates.io 的镜像

rsproxy.cn

RsProxy

RsProxy: a crates and rustup mirror

2.2 导出 build 中的项目

依次点击 Code​、Download as .zip file

图片

然后在文件夹里解压这个压缩包

2.3 打包

找到 package.json​,搜索 "name": ​,修改为想要的名字,比如我的就是 "name": "text-comparison-tool",

在 scripts 中添加两项

  "scripts": {
	...
    "tauri:dev": "tauri dev",
    "tauri:build": "tauri build"
  },

在终端打开文件夹,运行这两条命令

npm install --save-dev @tauri-apps/cli
npx tauri init

运行第二个命令的时候,这一条,请将 ../build ​修改为 ../dist,其他的直接回车就行

? Where are your web assets (HTML/CSS/JS) located, relative to the "<current dir>/src-tauri/tauri.conf.json" file that will be created? › ../build

然后找到 src-tauri\tauri.conf.json​,把里面的 "identifier": "com.tauri.dev", ​修改下,比如我的是 "identifier": "com.text-comparison-tool.dev",

再就是根据自己需求配置一些东西,都在 src-tauri\tauri.conf.json

比如在这里加个窗口最大化

"app": {
    "windows": [
      {
		...
        "maximized": true
      }
    ],

或者只打包成 exe,默认是 all,会同时输出 exe 和 msi,就个人体验来说,exe 更舒服点,推荐修改成 ["nsis"] ​来只打包成 exe

"bundle": {
    ...
    "targets": ["nsis"],
	...

最后开始打包

# 直接打包
npm run tauri:build

# 如果还想调试的话用这个
npm run tauri:dev

等待打包完成会有这个输出

✓ built in 6.39s
   Compiling app v0.1.0 (F:\Downloads\Edge\text-comparison-tool\src-tauri)
    Finished `release` profile [optimized] target(s) in 55.77s                                                                                                                                                  
       Built application at: F:\Downloads\Edge\text-comparison-tool\src-tauri\target\release\app.exe
        Info Patching F:\Downloads\Edge\text-comparison-tool\src-tauri\target\release\app.exe with bundle type information: nsis
        Info Target: x64
     Running makensis to produce F:\Downloads\Edge\text-comparison-tool\src-tauri\target\release\bundle\nsis\text-comparison-tool_0.1.0_x64-setup.exe
    Finished 1 bundle at:
        F:\Downloads\Edge\text-comparison-tool\src-tauri\target\release\bundle\nsis\text-comparison-tool_0.1.0_x64-setup.exe

找到这个 exe,安装完就可以和桌面应用一样打开了

3 资源占用

text-comparison-tool_0.1.0_x64-setup.exe ​占用 1.86MB

安装完对应的应用目录有两个文件:app.exe(8.23MB)、uninstall.exe(77.2KB)

运行的时候有两个进程:应用进程(2.9MB)、对应的 webview 进程(131.6MB)

占用还是高的,但是够我用了

最后如果感兴趣但没有 build 应用的话可以拿这个练手

accounts.google.com

登录 - Google 账号

1 个帖子 - 1 位参与者

阅读完整话题

来源: LinuxDo 最新话题查看原文