Skip to content

lizhiyu-me/wasm-lua

Repository files navigation

WebAssembly Lua 执行器

一个基于Web技术的Lua代码在线执行器,使用WebAssembly实现的Lua 5.4解释器在浏览器中直接运行Lua代码。

🌟 功能特性

  • 在线执行: 在浏览器中直接运行Lua代码,无需安装任何软件
  • 实时输出: 代码执行结果实时显示,支持多行输出
  • 示例代码: 内置多种Lua语法示例,方便学习和测试
  • 错误处理: 完善的错误提示和异常处理
  • 响应式设计: 支持桌面和移动设备访问
  • 现代化UI: 美观的用户界面,良好的用户体验

🚀 快速开始

  1. 直接使用: 在浏览器中打开 index.html 文件
  2. 本地服务器: 使用任何HTTP服务器托管项目文件
# 使用Python启动本地服务器
python -m http.server 8000

# 使用Node.js启动本地服务器
npm install
npm start

# 使用PHP启动本地服务器
php -S localhost:8000
  1. 访问: 在浏览器中访问 http://localhost:8000

注意: 由于使用ES6模块和CDN,建议使用HTTP服务器而不是直接打开HTML文件。

📝 使用方法

基本操作

  1. 编写代码: 在左侧代码编辑器中输入Lua代码
  2. 执行代码: 点击"执行代码"按钮或使用快捷键 Ctrl+Enter
  3. 查看结果: 在右侧输出区域查看执行结果
  4. 清空输出: 点击"清空输出"按钮清除执行结果

示例代码

项目内置了5个示例代码类别:

  • 基础语法: 变量声明、数据类型、基本操作
  • 数学计算: 算术运算、数学函数、三角函数
  • 循环控制: for循环、while循环、repeat-until循环
  • 函数定义: 基本函数、递归函数、匿名函数、闭包
  • 表操作: 数组、字典、嵌套表、遍历操作

点击对应的示例按钮即可加载并自动执行示例代码。

🛠️ 技术实现

核心技术

  • Lua解释器: 使用 Wasmoon

    • Wasmoon是一个用WebAssembly编译的Lua 5.4解释器
    • 完全兼容标准Lua语法
    • 支持所有Lua 5.4特性
    • 基于官方Lua源码编译,性能更优
    • 使用本地WASM文件,无需网络依赖
  • 前端技术:

    • HTML5 + CSS3 + JavaScript (ES6+)
    • 响应式设计,支持移动端
    • 现代化UI设计

项目结构

wasm-lua/
├── index.html          # 主页面
├── styles.css          # 样式文件
├── script.js           # JavaScript逻辑
├── debug.html          # 调试页面
├── test.html           # 测试页面
├── wasm/               # WebAssembly文件
│   ├── wasmoon.js      # Wasmoon JavaScript库
│   └── glue.wasm       # Lua WASM文件
└── README.md           # 项目说明

核心功能实现

  1. Lua状态管理: 使用Wasmoon创建和管理Lua虚拟机状态
  2. 输出重定向: 重定向Lua的print函数到网页输出区域
  3. 错误处理: 捕获和显示Lua代码执行错误
  4. 示例系统: 预定义示例代码,支持一键加载
  5. WebAssembly性能: 利用WebAssembly提供接近原生的执行性能

📚 支持的Lua特性

基本语法

  • 变量声明和赋值
  • 基本数据类型 (number, string, boolean, nil)
  • 运算符 (算术、比较、逻辑)
  • 控制结构 (if-else, for, while, repeat-until)

函数

  • 函数定义和调用
  • 参数传递和返回值
  • 递归函数
  • 匿名函数和闭包
  • 多返回值

表操作

  • 数组和字典
  • 表的创建和访问
  • 遍历操作 (pairs, ipairs)
  • 嵌套表结构

标准库

  • 基础函数 (print, type, tostring等)
  • 数学库 (math.*)
  • 字符串库 (string.*)
  • 表库 (table.*)

🔧 自定义和扩展

添加新的示例代码

script.js 文件中的 examples 对象中添加新的示例:

const examples = {
    // 现有示例...
    newExample: `-- 新的示例代码
print("这是一个新示例")
-- 更多代码...
`
};

修改样式

编辑 styles.css 文件来自定义界面样式:

/* 修改主题颜色 */
:root {
    --primary-color: #667eea;
    --secondary-color: #764ba2;
}

扩展功能

可以通过修改 script.js 来添加新功能:

  • 代码高亮
  • 代码保存和加载
  • 执行时间统计
  • 更多Lua库支持

🌐 浏览器兼容性

  • Chrome 60+
  • Firefox 55+
  • Safari 12+
  • Edge 79+

📄 许可证

本项目采用 MIT 许可证,详见 LICENSE 文件。

🤝 贡献

欢迎提交 Issue 和 Pull Request 来改进这个项目!

📞 联系方式

如有问题或建议,请通过以下方式联系:

  • 提交 GitHub Issue
  • 发送邮件至项目维护者

🔗 相关链接


注意: 本项目仅用于学习和演示目的,不建议在生产环境中使用。对于生产环境,建议使用官方的Lua解释器。

About

game made with lua

Resources

Stars

Watchers

Forks

Packages

No packages published