脚本
编辑脚本
Galacean Editor 提供了一个功能强大的代码编辑器，提供了代码提示，第三方包引入，引擎事件调试，脚本参数调试，项目实时预览等多种能力，可帮助你快速编辑和调试代码。
| 序号 | 区域 | 说明 |
|---|---|---|
| 1 | 文件列表 | 查看项目中的所有脚本文件 |
| 2 | 代码编辑区 | 编辑脚本文件，支持代码高亮，代码提示，代码格式化等功能 |
| 3 | 预览区 | 预览当前脚本的运行效果。保存代码后会实时刷新此区域的渲染状态 |
| 4 | 包依赖管理区 | 添加需要依赖的 NPM 三方包，比如 tween.js |
| 5 | 事件调试区 | 代码编辑器会自动检索所有绑定到引擎中的事件并显示在这里，你可以在这里触发事件，也可以配置事件的参数 |
| 5 | 控制台 | 查看代码运行时的日志信息 |
想要了解更多关于代码编辑器的信息，请查看代码编辑器。
代码编辑
在场景编辑器中创建脚本资产后，双击该脚本即可打开代码编辑器。Galacean 中的脚本需使用 Typescript 语言编写，同时新脚本默认基于内置模板创建。另外，Galacean 的代码编辑器基于 Monaco，快捷键与 VSCode 类似。修改脚本后，按 Ctrl/⌘ + S 保存，右侧实时预览区展现最新场景效果。
提示：Galacean 代码编辑器目前支持
.ts.gs和.glsl的文件编辑
文件预览
- 文件搜索 可快速搜索项目中的文件
- 代码筛选 文件树是否仅显示代码文件 (
.ts.gs.glsl) - 内置文件 用来显示哪些文件是不可编辑的内部文件
- 展开/隐藏 可切换文件夹的展开或隐藏
- 代码文件 可编辑的代码文件会显示对应的文件类型的缩略图标
引入第三方包
代码编辑器内置了与项目相对应的引擎，可自动提供引擎 API 的智能提示，从而帮助你快速实现基于引擎的逻辑。但大多数情况下你都需要引入 Galacean 生态包或其他第三方包来增强功能。
- 搜索框 在搜索框输入包名，按下 回车键，即可快速拉取包的版本列表
- 版本选择 默认情况下使用
latest版本 - 导入按钮 选择好包名和版本，点击导入按钮即可将三方包的类型信息加载到工作区
- 包列表 此处会列出当前项目依赖的所有第三方包
- 版本切换 此处可切换已导入的包的版本，切换后会将新的类型信息加载到工作区
试一下：在搜索框输入 @galacean/engine-toolkit，点击「引入」按钮，然后在代码中使用 import { OrbitControl } from '@galacean/engine-toolkit 来引入 OrbitControl 组件。
实时预览区
Galacean 的代码编辑器提供实时预览功能。保存代码后，预览区会自动更新，从而让你快速查看代码的执行结果。
- 拖动按钮 按住来拖动模拟器。将模拟器拖到屏幕右边缘，即可将其固定在右侧面板上。
- 统计信息切换 点击来切换场景统计信息的显示状态
- 新窗口打开 在新窗口中来打开项目预览页面
- 脚本参数编辑 如果当前场景中激活的脚本，拥有可配置的参数，即可打开此面板来实时调整脚本参数。想要了解脚本参数的详细信息，请查看 脚本系统
- 关闭按钮 点击来关闭模拟器。关闭后，屏幕右上方提供一个显示按钮，点击即可重新打开模拟器
事件调试
在代码编辑器中，我们提供了一个事件调试面板，从而帮助你快速调试场景中的事件。
- 事件列表 Galacean Editor 会自动收集场景中的所有事件名并显示在这里
- 事件参数配置 你可以点击此按钮来配置触发事件时所携带的参数，参数的配置使用
JSON格式编写 - 事件触发按钮 点击此按钮会触发场景中的对应事件
注意，脚本组件一定要绑定到某个实体上，才会展示事件列表。