如何修复 Tauri 发布后程序运行时显示 `asset not found: index.html` 的问题

news2025/3/14 10:22:24

如何修复 Tauri 发布后程序运行时显示 `asset not found: index.html` 的问题

在使用 Tauri 发布应用程序时，如果运行时出现 asset not found: index.html 的错误，通常是因为 Tauri 无法找到或正确加载前端资源文件（如 index.html）。以下是详细的修复步骤和解释。

检查时直接查看编译后包所在位置下面有没有index.html文件生成即可。
路径比如build,dist等，据配置文件配置指定。

问题原因

frontendDist 配置错误：tauri.conf.json 中的 build.frontendDist 路径未正确指向包含 index.html 的前端资源文件夹。
前端资源未正确打包：前端构建工具（如 Vite、Webpack）未将资源文件输出到 Tauri 预期的目录。
路径问题：在开发环境和生产环境中，路径配置不一致，导致资源加载失败。

修复步骤

1. 检查 `tauri.conf.json` 配置

确保 tauri.conf.json 中的 build.frontendDist 路径正确指向包含 index.html 的文件夹。例如：

{
  "build": {
    "frontendDist": "../dist", // 指向前端资源文件夹
    "devPath": "http://localhost:1420", // 开发环境路径
    "beforeDevCommand": "npm run dev",
    "beforeBuildCommand": "npm run build"
  }
}

如果使用 Vite，默认输出目录为 dist，确保 frontendDist 路径正确。
如果使用其他工具（如 Webpack），确保路径与输出目录一致。

2. 确保前端资源正确打包

运行前端构建命令，确保资源文件生成到正确目录。例如：

npm run build

检查 dist 目录下是否包含 index.html 及其他资源文件。
如果 dist 目录为空，检查前端构建工具的配置文件（如 vite.config.js 或 webpack.config.js），确保输出目录正确。

3. 检查路径问题

在开发环境中，Tauri 使用 devPath 加载前端资源（如 http://localhost:1420）。
在生产环境中，Tauri 使用 frontendDist 加载本地资源文件。
确保 index.html 及其依赖的资源文件（如 CSS、JS）路径正确。

4. 清理缓存并重新构建

有时缓存文件可能导致资源加载失败，清理缓存并重新构建：

# 清理缓存
rm -rf dist
rm -rf src-tauri/target

# 重新构建
npm run build
npx tauri build

5. 检查文件权限

在部分操作系统（如 Linux）中，文件权限可能导致资源加载失败。确保 dist 目录及其文件具有正确的权限：

chmod -R 755 dist

示例配置

以下是一个完整的 tauri.conf.json 示例：

{
  "$schema": "../node_modules/@tauri-apps/cli/schema.json",
  "build": {
    "frontendDist": "../dist", // 指向前端资源文件夹
    "devPath": "http://localhost:1420", // 开发环境路径
    "beforeDevCommand": "npm run dev",
    "beforeBuildCommand": "npm run build"
  },
  "package": {
    "productName": "MyApp",
    "version": "1.0.0"
  },
  "tauri": {
    "allowlist": {
      "all": true
    },
    "windows": [
      {
        "title": "MyApp",
        "width": 800,
        "height": 600,
        "resizable": true
      }
    ]
  }
}