uni-app多项目共用本地组件库有解决方案么，使用turborepo去管理是否可行

发布于 1周前 作者 yibo5220 来自 Uni-App

uni-app多项目共用本地组件库有解决方案么，使用turborepo去管理是否可行

公司有很多项目，共用一套组件库和工具库，PC端使用Turborepo管理的，准备将这些项目迁移到移动端，尝试使用Turborepo结合uniapp搭建。方案是否可行？写了一个demo但是没有成功，貌似组件库的代码没有被uniapp编译，只是加载进来了，求官方大大告知此方案是否可行。

Harmonyos Next教程
1 回复

在uni-app中管理多个项目并共用本地组件库确实是一个常见的需求。使用TurboRepo来管理这种多项目结构是可行的，并且TurboRepo提供了一系列工具来优化依赖管理和构建流程。以下是一个简要的示例，展示如何使用TurboRepo来管理包含共享组件库的uni-app项目。

1. 初始化TurboRepo项目

首先，你需要全局安装TurboRepo：

npm install -g turborepo

然后，创建一个新的TurboRepo项目：

mkdir my-uni-apps
cd my-uni-apps
turborepo init

这将生成一个基本的TurboRepo配置文件turbo.json。

2. 创建共享组件库

在TurboRepo项目的根目录下，创建一个新的包用于共享组件库，例如packages/shared-components：

mkdir -p packages/shared-components
cd packages/shared-components
npm init -y

在这个目录中，你可以添加你的uni-app组件代码。

3. 创建uni-app项目

接下来，创建你的uni-app项目，例如apps/app1和apps/app2：

mkdir -p apps/app1
cd apps/app1
npx degit dcloudio/uni-preset-vue#vite my-uni-app
cd ../../

mkdir -p apps/app2
cd apps/app2
npx degit dcloudio/uni-preset-vue#vite my-other-uni-app

4. 配置TurboRepo依赖

在turbo.json中，配置你的包和应用的依赖关系。例如：

{
  "pipeline": {
    "build": {
      "dependsOn": []
    },
    "install": {
      "dependsOn": []
    }
  },
  "projects": [
    {
      "name": "shared-components",
      "packagePath": "packages/shared-components"
    },
    {
      "name": "app1",
      "packagePath": "apps/app1",
      "dependsOn": ["shared-components"]
    },
    {
      "name": "app2",
      "packagePath": "apps/app2",
      "dependsOn": ["shared-components"]
    }
  ]
}

5. 安装依赖并构建

在TurboRepo项目的根目录下，运行以下命令来安装依赖并构建项目：

turbo run install
turbo run build --scope app1
turbo run build --scope app2

这样，TurboRepo会处理依赖关系，确保app1和app2能够访问并使用shared-components中的组件。

结论

使用TurboRepo来管理包含共享组件库的多个uni-app项目是一个有效的方法。上述示例展示了如何设置基本的项目结构和依赖关系，但你可能需要根据具体需求进一步自定义构建脚本和配置。

回到顶部