vitexec

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

vitexec

Use

vitexec

when the truth lives in the running browser: client state, imported app modules, DOM, canvas/WebGL, screenshots, recordings, or browser-only errors.

Do not use it for questions static files, unit tests, or TypeScript can answer directly.

当真实状态存在于运行中的浏览器时使用

vitexec

：客户端状态、导入的应用模块、DOM、canvas/WebGL、截图、录制内容或仅浏览器环境下的错误。

请勿将其用于静态文件、单元测试或TypeScript可直接解答的问题。

References

参考资料

For mouse, keyboard, pointer lock, gamepad, or other input, read references/inputs.md.
For CPU, network, performance timeline, or heap analysis, read references/performance.md.
For WebXR, read references/webxr.md.

如需了解鼠标、键盘、指针锁定、游戏手柄或其他输入相关内容，请阅读references/inputs.md。
如需了解CPU、网络、性能时间线或堆分析相关内容，请阅读references/performance.md。
如需了解WebXR相关内容，请阅读references/webxr.md。

Workflow

工作流程

Identify the page path if it is not
```
/
```
.
Write the smallest snippet that performs the user-like action or reads the browser-only state.

Run

vitexec '<snippet>'

, adding

--path

--gpu

--screenshot

--record

--cpu-profile

--network-trace

--performance-trace

--heap-snapshot

--timeout

, or

--config

only when needed.

Treat stdout as browser logs. It starts with
```
logs:
```
.

vitexec

itself is missing, install

vitexec

with the package manager already used by the project.

vitexec 'console.log("ready")'

For structured state, log JSON:

vitexec --path /cart '
  import { useCartStore } from "/src/store/cart.ts";
  document.querySelector("[data-testid=add-to-cart]")?.click();
  await new Promise((resolve) => requestAnimationFrame(resolve));
  console.log("cart", JSON.stringify(useCartStore.getState()));
'

若页面路径不是
```
/
```
，请明确页面路径。
编写最小化的代码片段，以执行类用户操作或读取仅浏览器环境下的状态。

运行

vitexec '<snippet>'

，仅在需要时添加

--path

、

--gpu

、

--screenshot

、

--record

、

--cpu-profile

、

--network-trace

、

--performance-trace

、

--heap-snapshot

、

--timeout

或

--config

参数。

将标准输出视为browser logs，其以
```
logs:
```
开头。

若缺少

vitexec

，请使用项目已有的包管理器安装

vitexec

。

vitexec 'console.log("ready")'

如需输出结构化状态，请记录JSON：

vitexec --path /cart '
  import { useCartStore } from "/src/store/cart.ts";
  document.querySelector("[data-testid=add-to-cart]")?.click();
  await new Promise((resolve) => requestAnimationFrame(resolve));
  console.log("cart", JSON.stringify(useCartStore.getState()));
'

Guidance

指导原则

Prefer importing exported app state over scraping DOM when state is available.
Use direct state reads for observation and assertions, not to bypass user interaction.
Use live progress logs and focused assertions to early-exit on failures and see current progress.
Keep logs concise; overly verbose logs become unreadable and unnecessarily fill the context.
Prefer browser-root imports such as
```
/src/store.ts
```
, not local filesystem paths.
Use
```
--gpu
```
for WebGL, canvas, Three.js, and WebXR behavior.
If the local machine has no usable GPU, use
```
--gpu --browser-ws-endpoint <ws-url>
```
to connect to a remote Playwright server that was started with the right host-specific GPU settings.
If repeated runs need the same endpoint or artifact settings, prefer
```
VITEXEC_*
```
environment variables over repeating long flags.
Use screenshots or recordings only when visual evidence matters.
Do not leave temporary code in the app when
```
vitexec
```
can inspect it from outside.

当状态可获取时，优先导入应用导出的状态，而非抓取DOM。
使用直接读取状态的方式进行观察和断言，而非绕过用户交互。
使用实时进度日志和聚焦断言，以便在失败时提前退出并查看当前进度。
保持日志简洁；过于冗长的日志会变得难以阅读，且不必要地占用上下文空间。
优先使用浏览器根路径导入，如
```
/src/store.ts
```
，而非本地文件系统路径。
针对WebGL、canvas、Three.js和WebXR行为，使用
```
--gpu
```
参数。
若本地机器无可用GPU，请使用
```
--gpu --browser-ws-endpoint <ws-url>
```
连接到已启动并配置了正确主机特定GPU设置的远程Playwright服务器。
若重复运行需要相同的端点或工件设置，优先使用
```
VITEXEC_*
```
环境变量，而非重复使用冗长的参数。
仅当视觉证据重要时才使用截图或录制功能。
当
```
vitexec
```
可从外部检查应用时，请勿在应用中留下临时代码。