tauri.conf.json, Field by Field

"The config file is the contract between your web half and your native half. Read it like one."

The Four Sections That Matter

tauri.conf.json is small but load-bearing. Four top-level sections do almost all the work:

Identity — productName, version, and identifier (a reverse-DNS string like com.acme.myapp). The identifier is how the OS names your app's data folders and signs your bundle.
build — how the frontend connects: beforeDevCommand (start your dev server), devUrl (where it lives, e.g. http://localhost:1420), beforeBuildCommand (build for production), and frontendDist (the folder of built static files Tauri ships).
app — runtime UI: the initial windows array (size, title, resizable…) and security (notably the Content Security Policy).
bundle — packaging: whether bundling is active, which targets to build (.dmg, .msi, AppImage…), and the icon set.

devUrl vs frontendDist: the Dev/Prod Switch

This pair confuses everyone once. In dev, Tauri points the webview at devUrl — a live dev server with hot-reload. In build, there is no server; Tauri loads the static files in frontendDist bundled inside the app. Same app, two ways of feeding it HTML. If your built app shows a blank window but dev works, frontendDist pointing at the wrong folder is the usual culprit.

The Schema Line Is Your Friend

The first line, "$schema": "https://schema.tauri.app/config/2", isn't decoration — it gives your editor autocomplete and validation for every field. If a key turns red in your editor, you typo'd it or it doesn't exist in v2. Trust the schema over a blog post written for v1.

Code

A real-shaped tauri.conf.json (this is the exact structure Cinder uses)·json

{
  "$schema": "https://schema.tauri.app/config/2",
  "productName": "My App",
  "version": "1.0.0",
  "identifier": "com.acme.myapp",
  "build": {
    "beforeDevCommand": "npm run dev",
    "devUrl": "http://localhost:1420",
    "beforeBuildCommand": "npm run build",
    "frontendDist": "../dist"
  },
  "app": {
    "windows": [
      { "title": "My App", "width": 1200, "height": 800, "resizable": true }
    ],
    "security": { "csp": null }
  },
  "bundle": {
    "active": true,
    "targets": "all",
    "icon": ["icons/128x128.png", "icons/icon.icns", "icons/icon.ico"]
  }
}

Exercise

Open your scaffolded app's tauri.conf.json. Change the window title and inner size, then run tauri dev and confirm the native window reflects it. Then find your identifier — is it a real reverse-DNS string, or a placeholder the scaffolder left? Fix it now, before you ever build a release.

Hint

The window config is under app.windows[0]. The identifier is a top-level key. If it still says something like com.tauri-app.dev, that's a placeholder — make it com.yourname.appname.