Create multiple windows [React, Vite, Tauri V2]

[sharp sierra]

I've tried things with my vite.config.ts:

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";

// @ts-expect-error process is a nodejs global
const host = process.env.TAURI_DEV_HOST;

// https://vitejs.dev/config/
export default defineConfig(async () => ({
  plugins: [react()],
  build: {
    rollupOptions: {
      input: {
        main: 'index.html',
        info: 'info.html',
      }
    }
  },

  // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
  //
  // 1. prevent vite from obscuring rust errors
  clearScreen: false,
  // 2. tauri expects a fixed port, fail if that port is not available
  server: {
    port: 1420,
    strictPort: true,
    host: host || false,
    hmr: host
      ? {
          protocol: "ws",
          host,
          port: 1421,
        }
      : undefined,
    watch: {
      // 3. tell vite to ignore watching `src-tauri`
      ignored: ["**/src-tauri/**"],
    },
  },
}));

And my tauri.conf.json:

{
  "$schema": "https://schema.tauri.app/config/2",
  "productName": "MacXP",
  "version": "0.1.0",
  "identifier": "com.winxptauri.app",
  "build": {
    "beforeDevCommand": "npm run dev",
    "devUrl": "http://localhost:1420",
    "beforeBuildCommand": "npm run build",
    "frontendDist": "../dist"
  },
  "app": {
    "withGlobalTauri": true,
    "windows": [
      {
        "label": "main",
        "title": "MacXP",
        "width": 800,
        "height": 600,
        "resizable": true,
        "fullscreen": false,
        "decorations": false,
        "transparent": false,
        "maximized": false,
        "visible": true,
        "theme": "Light",
        "center": true,
        "focus": true
      },
      {
        "label": "external",
        "title": "External Window",
        "width": 400,
        "height": 300,
        "resizable": true,
        "decorations": false,
        "transparent": false,
        "center": true,
        "focus": true,
        "visible": false,
        "url": "info.html"
      }
    ],
    "security": {
      "csp": null,
      "capabilities": [
        {
          "identifier": "window-access",
          "windows": ["main", "external"],
          "permissions": [
            "core:window:allow-start-dragging",
            "core:window:allow-close",
            "core:window:allow-minimize",
            "core:window:allow-maximize"
          ]
        }
      ]
    }
  },
  "bundle": {
    "active": true,
    "targets": "all",
    "icon": [
      "icons/32x32.png",
      "icons/128x128.png",
      "icons/[email protected]",
      "icons/icon.icns",
      "icons/icon.ico"
    ]
  }
}

[river finch]

#general message

[sharp sierra]

I've been using that this whole time 😭

The problem is the docs shows this:

tauri::Builder::default()

  .setup(|app| {
    let docs_window = tauri::WindowBuilder::new(
      app,
      "external", /* the unique window label */
      tauri::WindowUrl::External("https://tauri.app/".parse().unwrap())
    ).build()?;

    let local_window = tauri::WindowBuilder::new(
      app,
      "local",
      //3rd arg???? i get told i can use only 2.
      tauri::WindowUrl::App("index.html".into())
    ).build()?;

    Ok(())
  })

  .run(tauri::generate_context!())
  .expect("error while running app");

But when I try it, I get told the WindowBuilder only accepts 2 args, not three.