🔗 跨项目引用

在神岛地图开发过程中，为了提高代码复用率和开发效率，不同扩展地图之间可能会共享一些代码，特别是工具类代码。跨项目引用功能允许项目 A 直接使用项目 B 中的代码，实现功能复用。

🎯 功能概述

优势	说明
♻️ 代码复用	避免重复编写相同功能的代码，提高开发效率
🔄 统一维护	共享代码仅需在一处修改，所有引用项目自动获取更新
📦 模块化	促进代码模块化设计，提高项目可维护性

📝 实现步骤

1️⃣ 配置工作区

添加项目文件夹

AP 插件支持多项目开发模式，能够自动识别当前打开的项目文件，决定构建和资源管理的目标。通过以下步骤将项目 B 的文件夹引入工作区：

步骤	操作说明
1.	在资源管理器中，右键点击空白处
2.	选择 增加文件夹到工作区（Add Folder to Workspace...） 选项
3.	选择项目 B 的文件夹并点击确定

图1: 在 VS Code 中添加文件夹到工作区

接着，选择项目 B 的文件夹并点击确定。

图2: 选择要引用的项目文件夹

提示

💡 提示：完成上述步骤后，工作区将包含两个根文件夹，分别代表两个神岛代码项目。建议使用有意义的文件夹名称，以便于在工作区中区分不同项目。

2️⃣ 配置项目引用

假设我们现在想在 bottleMan 项目中引用 Backroom 项目中的 sum 函数。

修改 tsconfig 配置

🔧 关键配置：

在 bottleMan 项目下的服务端或客户端的 tsconfig.json 文件中，将 rootDir 属性设置为 ../../，以便能够引用到 Backroom 项目下的文件。

图3: 修改 tsconfig.json 配置文件

引用目标文件

在 bottleMan 项目下的服务端 App.ts 文件中，直接引用 Backroom 项目下的 utils.ts 文件。

// bottleMan/server/App.ts
import { sum } from "../../Backroom/shares/utils";

export default {
  onPlayerJoin(player) {
    const result = sum(5, 3);
    player.sendChat(`5 + 3 = ${result}`);
  },
};

图4: 在代码中引用另一个项目的文件

3️⃣ 验证引用

通过构建项目，在神岛编辑器中验证是否能够正常使用引用的代码。

图5: 在神岛编辑器中验证跨项目引用效果

⚠️ 注意事项

注意点	详细说明
🔍 路径正确性	确保被引用项目的文件路径正确，相对路径基于配置的 rootDir
⚙️ 配置检查	检查 tsconfig 配置是否生效，特别是 rootDir 和 baseUrl 等属性
🔄 依赖关系	构建时注意项目依赖关系，被引用项目的代码变更可能影响引用项目
🧩 类型定义	确保跨项目引用的类型定义正确，避免类型不匹配问题

警告

⚠️ 警告：修改被引用项目中的代码后，请确保重新构建引用该项目的所有项目，以确保更改生效。

📈 最佳实践

实践	说明
📁 统一共享代码位置	将可能被多个项目引用的代码放在统一的 shares 文件夹中
📝 完善文档注释	为共享代码添加详细的文档注释，便于其他项目开发者理解和使用
🧪 编写单元测试	为共享代码编写单元测试，确保跨项目引用的稳定性
🔖 版本管理	对共享代码进行版本管理，记录重要变更，便于追踪问题

通过以上步骤，我们成功实现了在神岛地图开发中的跨项目代码引用，提高了开发效率和代码复用率。这种方法特别适用于团队开发多个相关联的神岛地图项目，可以显著减少重复代码并提高代码质量。