GPUX v0.1
AI

Guide · 01 Setup

快速开始 (Getting Started)

配置 Rust 工具链，安装 gpux-cli，创建并运行你的第一个跨平台原生 GPU 应用。

1. 环境要求与系统依赖

GPUX 基于 Rust 2024 Edition (rustc 1.85+)。在开始前请确保已安装 Rust 工具链与对应系统的图形开发头文件：

操作系统图形后端系统依赖安装命令
macOS 13+Metal + CoreTextxcode-select --install
Ubuntu / DebianVulkan (Wayland/X11)sudo apt install libxcb1-dev libxkbcommon-dev libxkbcommon-x11-dev libwayland-dev libvulkan-dev
Arch LinuxVulkan (Wayland/X11)sudo pacman -S vulkan-icd-loader libxkbcommon wayland
Windows 10/11DirectX 12安装 Visual Studio C++ Build Tools 与 Windows 11 SDK

2. 使用 9 大生态命令一键安装或创建工程

GPUX 原生支持 Bash、PowerShell、Fish、Cargo 以及主流前端包管理器（npm、Yarn、pnpm、bun、deno）一键拉起脚手架：

curl -fsSL https://gpux.waya.ink/install.sh | bash
gpux init my-studio && cd my-studio && gpux dev
irm https://gpux.waya.ink/install.ps1 | iex
gpux init my-studio; cd my-studio; gpux dev
curl -fsSL https://gpux.waya.ink/install.fish | source
gpux init my-studio; and cd my-studio; and gpux dev
cargo install gpux-cli
gpux init my-studio && cd my-studio && gpux dev
npm create gpux@latest my-studio
cd my-studio && npm run dev
yarn create gpux my-studio
cd my-studio && yarn dev
pnpm create gpux my-studio
cd my-studio && pnpm dev
bun create gpux my-studio
cd my-studio && bun run dev
deno run -A npm:create-gpux@latest my-studio
cd my-studio && deno task dev

3. 诊断 8 端工具链并启动热重载

bash 
# 诊断本地 Rust 与 8 端交叉编译工具链 (Desktop / iOS / Android / HarmonyOS / Web WASM)
gpux doctor

# 启动桌面或指定目标平台开发会话
gpux dev --target desktop

4. 生成的目录结构

text 
my-studio/
├── gpux.json          # 统一应用清单 (窗口尺寸、标识符、移动端 SafeArea 与 Web/小程序配置)
├── Cargo.toml         # 依赖 gpux 统一 SDK
└── src/
    └── main.rs        # GPUI 视图与 ServiceRegistry 入口

5. 编写第一个 GPU 原生视图与强类型服务 (`src/main.rs`)

打开 src/main.rs，你无需编写任何 HTML/CSS 或过程宏，即可使用 gpux::prelude::* 与 gpui-kit 组件构建完整应用：

rust 
use gpux::prelude::*;
use gpux::ui::component::button::{Button, ButtonVariants as _};
use gpux::ui::{ActiveTheme, Sizable as _, StyledExt as _};
use serde::{Deserialize, Serialize};
use std::sync::Arc;

#[derive(Serialize, Deserialize)]
struct PingReq { node: String }

#[derive(Serialize, Deserialize)]
struct PingResp { latency_us: u64, backend: String }

struct StudioView {
    services: Arc<ServiceRegistry>,
    status: String,
}

impl Render for StudioView {
    fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
        let theme = cx.theme();
        v_flex()
            .size_full()
            .p_6()
            .gap_4()
            .bg(theme.background)
            .text_color(theme.foreground)
            .child(div().text_xl().font_bold().child("GPUX Native Studio"))
            .child(div().text_sm().text_color(theme.muted_foreground).child(self.status.clone()))
            .child(
                h_flex().gap_2().child(
                    Button::new("btn-ping")
                        .primary()
                        .small()
                        .label("调用强类型服务 (1.2µs)")
                        .on_click(cx.listener(|this, _, _, cx| {
                            if let Ok(res) = this.services.call::<PingReq, PingResp>(
                                "node.ping",
                                &PingReq { node: "edge-shanghai-01".into() },
                            ) {
                                this.status = format!("Backend: {} ({} µs)", res.backend, res.latency_us);
                                cx.notify();
                            }
                        })),
                ),
            )
    }
}

fn main() -> anyhow::Result<()> {
    let app = gpux::app("my-studio")
        .title("GPUX Native Studio")
        .window_size(1120, 720)
        .bind("node.ping", |req: PingReq| -> anyhow::Result<PingResp> {
            Ok(PingResp {
                latency_us: 1,
                backend: format!("{} · {:?}", req.node, Platform::current().render_backend()),
            })
        });

    let services = app.services();
    gpux::desktop::run_with_view(app, move |_window, cx| {
        cx.new(|_| StudioView {
            services: services.clone(),
            status: "Ready · GPU Pipeline".into(),
        })
    })
}