發(fā)與部署完整指南:從pnpm dev到打包三端客戶(hù)端)
FreeReNamer批量重命名工具本地開(kāi)發(fā)與部署完整指南從pnpm dev到打包三端客戶(hù)端【免費(fèi)下載鏈接】FreeReNamer功能強(qiáng)大又易用的文件批量重命名軟件項(xiàng)目地址: https://gitcode.com/gh_mirrors/fr/FreeReNamerFreeReNamer是一款功能強(qiáng)大又易用的文件批量重命名軟件同時(shí)提供網(wǎng)頁(yè)版與 Tauri 桌面客戶(hù)端兩種形態(tài)。這篇文章帶你完成 FreeReNamer 的本地開(kāi)發(fā)與部署全流程用pnpm dev三步跑起網(wǎng)頁(yè)版、用pnpm tauri dev調(diào)試桌面客戶(hù)端最終打包出 Windows / macOS / Linux 三端安裝包新手也能直接照做 ?項(xiàng)目一覽Web Tauri 雙端架構(gòu)FreeReNamer 采用一套前端代碼、雙平臺(tái)運(yùn)行的架構(gòu)通過(guò)PLATFORM環(huán)境變量區(qū)分構(gòu)建目標(biāo)由 Vite 在編譯期注入全局常量運(yùn)行時(shí)自動(dòng)選擇對(duì)應(yīng)的文件操作實(shí)現(xiàn)技術(shù)作用React 18 TypeScript Vite前端界面與構(gòu)建Tauri 1.x Rust桌面客戶(hù)端原生能力TanStack Router / Query路由與異步數(shù)據(jù)Jotai shadcn/ui狀態(tài)管理與 UI 組件核心目錄速查src/components/界面組件文件面板、規(guī)則編輯、設(shè)置等src/lib/rules/批量重命名規(guī)則引擎替換、刪除、格式化、模板、腳本、AI 等src/lib/file/平臺(tái)無(wú)關(guān)的文件操作封裝file.web.ts走瀏覽器 APIfile.tauri.ts走 Rust 原生命令src-tauri/Rust 后端核心命令在src-tauri/src/main.rssrc-tauri/tauri.conf.json窗口、權(quán)限與打包配置環(huán)境準(zhǔn)備安裝 Node.js、pnpm 與 Rust 工具鏈 只玩網(wǎng)頁(yè)版可以跳過(guò) Rust要打包桌面客戶(hù)端則兩者都要裝。依賴(lài)用途要求Node.js前端運(yùn)行環(huán)境18 及以上版本pnpm依賴(lài)包管理8 及以上版本Rustrustup桌面客戶(hù)端編譯stable 版本平臺(tái)構(gòu)建工具原生編譯Windows 需 Visual Studio Build ToolsLinux 需 webkit2gtk 等 WebView 依賴(lài)安裝完成后用node -v、pnpm -v、rustc -v三個(gè)命令確認(rèn)版本均正常輸出即可。pnpm dev 三步跑起網(wǎng)頁(yè)版第 1 步獲取源碼git clone https://gitcode.com/gh_mirrors/fr/FreeReNamer cd FreeReNamer第 2 步安裝依賴(lài)pnpm install第 3 步啟動(dòng)開(kāi)發(fā)服務(wù)器pnpm dev腳本實(shí)際執(zhí)行的是cross-env PLATFORMweb vite瀏覽器打開(kāi)http://localhost:1420即可看到 FreeReNamer 批量重命名界面改代碼即時(shí)熱更新。開(kāi)發(fā)端口 1420 在vite.config.ts中配置為strictPort若提示端口被占用釋放掉再啟動(dòng)即可。網(wǎng)頁(yè)版運(yùn)行效果如下左側(cè)添加文件與文件夾右側(cè)編排處理規(guī)則執(zhí)行前會(huì)實(shí)時(shí)預(yù)覽新文件名 網(wǎng)頁(yè)版小提示文件操作基于瀏覽器 FileSystemHandle API建議使用最新版 Chrome配置數(shù)據(jù)存儲(chǔ)在 IndexedDB 中而桌面端則存儲(chǔ)在本地文件。桌面客戶(hù)端本地調(diào)試pnpm tauri dev裝好 Rust 后一條命令即可啟動(dòng) Tauri 桌面端熱調(diào)試pnpm tauri dev它會(huì)先通過(guò)beforeDevCommand自動(dòng)運(yùn)行pnpm dev-in-tauri即PLATFORMtauri vite再拉起原生窗口前端與 Rust 兩側(cè)改動(dòng)都能即時(shí)生效。Rust 側(cè)在src-tauri/src/main.rs中暴露了rename、read_dir、is_file等 Tauri 命令前端通過(guò)src/lib/file/file.tauri.ts調(diào)用這些命令完成真正的重命名性能與兼容性都優(yōu)于網(wǎng)頁(yè)版。生產(chǎn)構(gòu)建打包 Windows / macOS / Linux 客戶(hù)端打包網(wǎng)頁(yè)版產(chǎn)物在dist/可部署到任意靜態(tài)服務(wù)器pnpm build打包桌面客戶(hù)端pnpm tauri buildtauri.conf.json中bundle.targets已設(shè)為all在哪個(gè)系統(tǒng)上執(zhí)行命令就產(chǎn)出對(duì)應(yīng)平臺(tái)的安裝包跨平臺(tái)打包需要目標(biāo)系統(tǒng)或交叉編譯環(huán)境平臺(tái)常見(jiàn)產(chǎn)物WindowsNSIS 安裝程序.exemacOS.dmg / .appLinux.deb / .AppImage 等打包完成的安裝包位于src-tauri/target/release/bundle/目錄下應(yīng)用標(biāo)識(shí)為com.cyhuajuan.free-renamer。常見(jiàn)問(wèn)題快速排查清單端口 1420 被占用strictPort模式下 Vite 不會(huì)自動(dòng)換端口殺掉占用進(jìn)程后重啟。pnpm tauri dev報(bào)找不到 rustc未安裝 Rust 工具鏈按上文用 rustup 安裝后重開(kāi)終端。Linux 啟動(dòng)白屏/報(bào)錯(cuò)缺少 WebView 依賴(lài)如 webkit2gtk安裝發(fā)行版對(duì)應(yīng)開(kāi)發(fā)包即可。代碼風(fēng)格檢查提交前運(yùn)行pnpm lint基于 Biome確保通過(guò)。關(guān)鍵文件路徑總結(jié)文件說(shuō)明package.jsondev / build / tauri 等腳本入口vite.config.ts1420 端口與 PLATFORM 注入配置src/lib/rules/index.ts所有重命名規(guī)則的注冊(cè)入口src/lib/file/file.web.ts網(wǎng)頁(yè)版文件操作實(shí)現(xiàn)src/lib/file/file.tauri.ts桌面端文件操作實(shí)現(xiàn)src-tauri/src/main.rsRust 命令與 Tauri 應(yīng)用入口src-tauri/tauri.conf.json窗口權(quán)限與打包配置總結(jié) 到這里你已經(jīng)完整走通了 FreeReNamer 的本地開(kāi)發(fā)與部署pnpm dev啟動(dòng)網(wǎng)頁(yè)版、pnpm tauri dev調(diào)試桌面端、pnpm tauri build打包出 Windows / macOS / Linux 客戶(hù)端。得益于 Web Tauri 雙端架構(gòu)一套代碼即可覆蓋瀏覽器與桌面場(chǎng)景非常適合想在本地體驗(yàn)或二次開(kāi)發(fā)批量重命名工具的同學(xué)上手?!久赓M(fèi)下載鏈接】FreeReNamer功能強(qiáng)大又易用的文件批量重命名軟件項(xiàng)目地址: https://gitcode.com/gh_mirrors/fr/FreeReNamer創(chuàng)作聲明:本文部分內(nèi)容由AI輔助生成(AIGC),僅供參考