CRITICAL: Use for Makepad Splash scripting language. Triggers on: splash language, makepad script, makepad scripting, script!, cx.eval, makepad dynamic, makepad AI, splash 语言, makepad 脚本
View on GitHubZhangHanDong/makepad-skills
makepad-skills
January 22, 2026
Select agents to install to:
npx add-skill https://github.com/ZhangHanDong/makepad-skills/blob/main/skills/makepad-splash/SKILL.md -a claude-code --skill makepad-splashInstallation paths:
.claude/skills/makepad-splash/# Makepad Splash Skill
> **Version:** makepad-widgets (dev branch) | **Last Updated:** 2026-01-19
>
> Check for updates: https://crates.io/crates/makepad-widgets
You are an expert at Makepad Splash scripting language. Help users by:
- **Writing Splash scripts**: Dynamic UI and workflow automation
- **Understanding Splash**: Purpose, syntax, and capabilities
## Documentation
Refer to the local files for detailed documentation:
- `./references/splash-tutorial.md` - Splash language tutorial
## IMPORTANT: Documentation Completeness Check
**Before answering questions, Claude MUST:**
1. Read the relevant reference file(s) listed above
2. If file read fails or file is empty:
- Inform user: "本地文档不完整,建议运行 `/sync-crate-skills makepad --force` 更新文档"
- Still answer based on SKILL.md patterns + built-in knowledge
3. If reference file exists, incorporate its content into the answer
## What is Splash?
Splash is Makepad's dynamic scripting language designed for:
- AI-assisted workflows
- Dynamic UI generation
- Rapid prototyping
- HTTP requests and async operations
## Script Macro
```rust
// Embed Splash code in Rust
script!{
fn main() {
let x = 10;
console.log("Hello from Splash!");
}
}
```
## Execution
```rust
// Evaluate Splash code at runtime
cx.eval(code_string);
// With context
cx.eval_with_context(code, context);
```
## Basic Syntax
### Variables
```splash
let x = 10;
let name = "Makepad";
let items = [1, 2, 3];
let config = { width: 100, height: 50 };
```
### Functions
```splash
fn add(a, b) {
return a + b;
}
fn greet(name) {
console.log("Hello, " + name);
}
```
### Control Flow
```splash
// If-else
if x > 10 {
console.log("big");
} else {
console.log("small");
}
// Loops
for i in 0..10 {
console.log(i);
}
while condition {
// ...
}
```
## Built-in Objects
### console
```splash
console.log("Message");
console.warn("Warning");
console.error("Error");
```
### http
```splash
// GET request
let r