ใช้ monorepos กับโฮสติ้งแอป
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
เมื่อใช้ Monorepo คุณจะจัดระเบียบและจัดการโปรเจ็กต์หลายรายการในไดเรกทอรีเดียวได้
คำแนะนำนี้จะอธิบายวิธีเริ่มต้นใช้งานการติดตั้งใช้งานแอปที่ใช้ Nx ด้วย
App Hosting
ทําให้ Monorepo ใช้งานได้กับคอนโซล Firebase
การรองรับ Monorepo มีอยู่ในขั้นตอนการตั้งค่าแบ็กเอนด์แบบกราฟิกในคอนโซล Firebase เมื่อระบบแจ้งให้ระบุ "ไดเรกทอรีราก" ในส่วน "การตั้งค่าการติดตั้งใช้งาน"
ให้ระบุเส้นทางไปยังแอปพลิเคชันที่ต้องการติดตั้งใช้งานภายใน Monorepo
ทําให้ Monorepo ใช้งานได้ด้วย Firebase CLI
การรองรับ Monorepo มีอยู่ในขั้นตอนการตั้งค่าแบ็กเอนด์ที่เรียกใช้โดยคำสั่ง Firebase
CLI apphosting:backends:create หลังจากเข้าสู่โฟลว์นี้และระบุที่เก็บ GitHub ที่เลือกแล้ว ระบบจะแจ้งให้คุณระบุไดเรกทอรีรากของแอปที่สัมพันธ์กับที่เก็บของคุณ ในพรอมต์นี้ ให้ส่งเส้นทางไปยังแอปพลิเคชันที่คุณต้องการติดตั้งใช้งานภายใน Monorepo
$ firebase apphosting:backends:create --project [project-name]
i === Import a GitHub repository
✔ Connected with GitHub successfully
? Which GitHub repo do you want to deploy? gh-username/nx-monorepo
? Specify your app's root directory relative to your repository path/to/app
ตัวอย่างเช่น ต่อไปนี้คือชิ้นงานที่จะได้รับการติดตั้งใช้งานเมื่อกำหนดโครงสร้างโปรเจ็กต์ Nx
และ "target-app" เป็นแอปพลิเคชันที่คุณต้องการสร้างและ
ติดตั้งใช้งาน
.
├── lib
├── apps
│ └── target-app
│ ├── project.json
│ └── src
│ └── ...
├── nx.json
├── package-lock.json
└── package.json
ไดเรกทอรีรากของแอปที่สัมพันธ์กับที่เก็บของคุณคือ apps/target-app
การแก้ปัญหาการติดตั้งใช้งาน Monorepo
- หากไม่ได้ระบุช่อง "รูทไดเรกทอรี" บิลด์จะล้มเหลว
และแสดงข้อความว่า
App Hosting ไม่พบโปรเจ็กต์ที่จะกำหนดเป้าหมายภายใน Monorepo ของ Nx
- สำหรับแอปพลิเคชัน Nx + Angular คุณต้องใช้โปรแกรมสร้างแอปพลิเคชัน Angular เพื่อสร้างแอปพลิเคชัน มีการระบุตัวสร้างแอปพลิเคชัน Angular ใน
project.json
เนื้อหาของหน้าเว็บนี้ได้รับอนุญาตภายใต้ใบอนุญาตที่ต้องระบุที่มาของครีเอทีฟคอมมอนส์ 4.0 และตัวอย่างโค้ดได้รับอนุญาตภายใต้ใบอนุญาต Apache 2.0 เว้นแต่จะระบุไว้เป็นอย่างอื่น โปรดดูรายละเอียดที่นโยบายเว็บไซต์ Google Developers Java เป็นเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-08-20 UTC
[null,null,["อัปเดตล่าสุด 2025-08-20 UTC"],[],[],null,["\u003cbr /\u003e\n\nWith monorepos, you can organize and manage multiple projects in a single\ndirectory. This guide describes how to get started deploying Nx-based apps with\nApp Hosting.\n\nDeploy monorepos with the Firebase console\n\nMonorepo support is built into the graphical backend setup flow in the Firebase\nconsole. When prompted for a \"Root directory\" under \"Deployment settings,\"\nspecify the path to the application you want to deploy inside the monorepo:\n\nDeploy monorepos with the Firebase CLI\n\nMonorepo support is built into the backend setup flow invoked by the Firebase\nCLI command `apphosting:backends:create`. After you enter this flow and specify\nyour chosen GitHub repository, you are prompted to specify your app's root\ndirectory relative to your repository; at this prompt, pass the path to the\napplication you want to deploy inside the monorepo: \n\n $ firebase apphosting:backends:create --project [project-name]\n i === Import a GitHub repository\n ✔ Connected with GitHub successfully\n\n ? Which GitHub repo do you want to deploy? gh-username/nx-monorepo\n ? Specify your app's root directory relative to your repository path/to/app\n\nFor example, here are the assets that would be deployed given the following Nx\nproject structure and \"target-app\" as the application you want to build and\ndeploy: \n\n .\n ├── lib\n ├── apps\n │ └── target-app\n │ ├── project.json\n │ └── src\n │ └── ...\n ├── nx.json\n ├── package-lock.json\n └── package.json\n\nThe app's root directory relative to your repository is `apps/target-app`.\n\nTroubleshooting monorepo deployment\n\n- If you do not specify the \"root directory\" field, then the build will fail and display a message that App Hosting cannot find a project to target inside the Nx monorepo.\n- For Nx + Angular applications, you must use the [Angular application\n builder](https://angular.io/guide/esbuild) to build the application. The Angular application builder is specified in `project.json`"]]
