在虚幻引擎编程中使用TypeScript脚本

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

在虚幻引擎（Unreal Engine）中，官方并未原生支持 TypeScript (TS)，但可以通过第三方插件或工具实现类似功能（如使用 Puerts 或 Unreal.js）。以下是基于 Puerts（一个流行的 TypeScript 集成方案）的指南：

一、 使用 Puerts 集成 TypeScript

Puerts 是一个将 TypeScript 与虚幻引擎结合的插件，支持 UE4/UE5，允许你在 TypeScript 中编写游戏逻辑，并与引擎的 C++/蓝图 API 交互。

1.1 安装 Puerts

步骤：

1.下载 Puerts 插件：
GitHub 仓库：https://github.com/Tencent/puerts
选择与你的 UE 版本兼容的分支。
2.将插件复制到项目的 Plugins 目录下（若目录不存在则手动创建）。
3.重新生成项目文件（右键 .uproject 文件，选择 Generate Visual Studio Project Files）。
4.编译项目。

1.2 配置 TypeScript 环境

步骤：

1.在项目中创建 Scripts 目录（例如 Content/TypeScript）。
2.初始化 TypeScript 项目：

cd Content/TypeScript
npm init -y
npm install typescript @types/puerts --save-dev

3.创建 tsconfig.json：

{
  "compilerOptions": {
    "target": "es2016",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "outDir": "dist"
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules"]
}

1.3 编写 TypeScript 代码

步骤：

1.在 src 目录下创建 .ts 文件（如 Main.ts）：

import * as UE from 'ue';
import { $ref, $unref } from 'puerts';

class MyActor extends UE.Actor {
    Tick(deltaTime: number): void {
        console.log(`Tick! DeltaTime: ${deltaTime}`);
    }
}

export default MyActor;

2.编译 TypeScript:

npx tsc

1.4 在蓝图中调用 TypeScript

步骤：

1.在虚幻编辑器中，创建一个蓝图类（如 BP_MyActor）。
2.在蓝图中添加 Puerts 节点（如 Execute Js Module），指定编译后的 .js 文件路径（如 Content/TypeScript/dist/Main.js）。
3.通过蓝图调用 TypeScript 类的方法。

二、使用 Unreal.js（备选方案）

Unreal.js 是另一个允许在 UE 中运行 JavaScript/TypeScript 的插件，但更新频率较低。

1.下载插件：https://github.com/ncsoft/Unreal.js
2.将插件放置到 Plugins 目录。
3.在编辑器中通过控制台或蓝图执行 JS/TS 代码。

关键注意事项

性能：TypeScript 适用于非性能敏感的模块（如 UI、游戏逻辑），性能关键部分仍需用 C++ 实现。
调试：使用 Chrome DevTools 或 VSCode 调试 TypeScript（需配置 sourcemap）。
API 交互：通过 Puerts 的类型声明文件（@types/puerts）访问 UE 的 C++ 类和蓝图函数。
打包：确保 TypeScript 文件被包含在打包后的项目中。

示例：TypeScript 与 UE 交互

// 调用 UE 的 API
const playerController = UE.GameplayStatics.GetPlayerController(this, 0);
const hitResult = $ref<UE.HitResult>(new UE.HitResult());
if (UE.KismetSystemLibrary.LineTraceSingle(this, start, end, UE.ETraceTypeQuery.TraceTypeQuery1, false, [], UE.EDrawDebugTrace.None, hitResult, true)) {
    const hitActor = $unref(hitResult).Actor;
    console.log("Hit Actor:", hitActor.GetName());
}

总结

通过上述方法，你可以在虚幻引擎中结合 TypeScript 进行开发，享受静态类型和现代语法带来的便利，同时利用 UE 的强大功能。