소개
__CAPGO_KEEP_0__은 AI 앱 빌더로, 명령어를 통해 몇 분만에 작동하는 React 앱을 생성합니다. 브라우저에서 빠르게 배포할 수 있지만, App Store와 Google Play에 배포하고 홈 스크린에 있는 원생 앱처럼 원하는 앱을 만들고 싶다면? 이 안내서에서는 Lovable에서 내보내기, 웹 앱을
__CAPGO_KEEP_0__ Capacitor__CAPGO_KEEP_0__ Builder Capgo Builder __CAPGO_KEEP_0__ Capgo Live Updates.
우리는 커서 전체적인 — AI는 대부분의 터미널 명령어를 자동으로 처리할 수 있으므로 수동으로 입력하지 않으려면
필요 시간: 처음에는 약 1–2 시간 정도 소요되며, 주로 계정 설정과 클라우드 빌드 대기 시간이 대부분입니다.
마지막까지는 다음과 같은 결과를 얻을 것입니다.
- 클라우드에서 빌드된 네이티브 iOS 및 Android 앱 — Xcode 또는 Android Studio는 주요 경로에 없습니다.
- 실제 장치에서 앱이 실행되는 것 (TestFlight, 직접 설치, 또는 Play 내부 테스트)
- 네이티브 앱만 제공할 수 있는 작동하는 카메라 기능
- Live Updates가 구성되어 UI 및 CSS 수정이 스토어 리뷰 없이 배포되도록
사전 요구 사항
| 요구 사항 | 세부 정보 |
|---|---|
| 컴퓨터 | Mac, Windows, 또는 Linux — 클라우드 빌드는 어떤 OS에서나 작동합니다. |
| code 편집기 | 커서 (권장) 또는 VS Code |
| Node.js | 24 LTS (최신 버전 — nodejs.org에서 다운로드) Git) |
| Lovable 레포지토리를 __CAPGO_KEEP_0__에서 클론하세요. | GitHub |
| Capgo 계정 | 무료 가입 — 클라우드 빌드 및 실시간 업데이트 |
공개로 게시하기 위해만 발생하는 비용:
| 아이템 | 비용 |
|---|---|
| 애플 개발자 프로그램 | 1년 $99 |
| 구글 플레이 콘솔 | 1회 $25 |
| Cursor Pro | 월 $20 (AI 명령 실행을 위한 권장 사항이지만 선택 사항) |
| Capgo | 생산 규모에 맞는 유료 계획이 있는 무료 티어가 있습니다. |
(로컬 시뮬레이터만 해당) 선택 사항:
| 도구 | 왜 |
|---|---|
| Xcode (~15 GB, macOS 전용) | Mac에서 iOS 시뮬레이터 |
| Android Studio (~1 GB + SDKs) | Android 에뮬레이터 |
두 가지 모두 생략할 수 있습니다. 이 가이드의 주요 경로에서는 클라우드에서 빌드하고 실제 장치에 설치합니다.
빠른 참고: 사랑스러운 프레임워크와
code를 조작하기 전에 알아야 할 점이 있습니다. __CAPGO_KEEP_0__의 웹 앱 종류는 Lovable이 생성하는 것이 휴대폰 wrapping에 영향을 미친다..
__CAPGO_KEEP_0__ 시간 동안, Lovable의 기본값은 React + Vite 단일 페이지 앱 (SPA)이었다.2026년 5월부터, 새로운 Lovable 앱은 TanStack Start with 서버 사이드 렌더링 (SSR)으로 기본값을 사용할 수 있다. SSR은 웹에 좋지만 Capacitor는 정적 빌드 — HTML, CSS, 및 JavaScript로 구성된 폴더에 HTML 파일이 하나 포함된 —을 래핑한다. SSR 앱은 각 요청마다 페이지를 서버에서 렌더링하는 것을 기대한다. 휴대폰에는 서버가 없기 때문에 __CAPGO_KEEP_0__에서는 정적, 클라이언트 렌더링된 출력을 원한다. index.html 무엇을 할 것인가:
Capacitor의 웹 앱 종류는 Lovable이 생성하는 것이 휴대폰 wrapping에 영향을 미친다. __CAPGO_KEEP_0__ 시간 동안, Lovable의 기본값은.
React + Vite 단일 페이지 앱 (SPA)이었다.
- 새로운 시작: Lovable에게 싱글 페이지 애플리케이션 (SPA) 또는 SSR을 생략하여 정적
dist/폴더. - TanStack Start (SSR)로 이미 시작했습니다: 정적 SPA를 미리 렌더링하거나 출력하도록 구성하세요. 정적 빌드 폴더에 포함된
index.html. - Next.js Lovable 프로젝트 (기존): 사용 정적 내보내기 —
out/대신dist/.
어떤 프레임워크를 사용하더라도 Capacitor’s webDir 를 해당 폴더로 지정하세요. Vite SPA의 경우 dist.
Step 1 — GitHub을 Export하세요
Lovable은 code을 편집기에 보관합니다. GitHub을 연결할 때까지
- Lovable 프로젝트를 브라우저에서 열어보세요
- 클릭 업그레이드 (상단 우측) 필요 시 업그레이드 후 Git 좌측 메뉴에서
- __CAPGO_KEEP_0__을 선택하세요 GitHub__CAPGO_KEEP_0__ 계정 인증 및 연결
- Lovable은 앱을 자동으로 저장소와 연결합니다.




✅ 성공: __CAPGO_KEEP_0__ 방문 github.com/YOUR-USERNAME/your-app shows your app’s code.
애플리케이션을 로컬에서 작업하기 전에 __CAPGO_KEEP_1__ 에디터가 필요합니다. 우리는 Cursor를 추천합니다.
Before we can work with your code locally, you’ll need a code editor. We recommend __CAPGO_KEEP_1____CAPGO_KEEP_0__ AI-파워드 에디터는 터미널 명령어를 자동으로 실행할 수 있습니다.
다운로드 및 설치: 커서
- Visit 커서.sh 운영 체제에 맞는 커서 버전을 다운로드하세요
- 커서 설치를 위해 설치 마법사를 따라하세요
- 커서가 설치되면 커서를 열어보세요

AI 개발을위한 커서 설정
최적의 경험을 위해 커서를 설정하세요.
- 커서 플랜 구매 — 커서에는 무료 티어가 있지만, 프로 플랜 ($20/월)은 무제한 AI 완성, 클라우드 및 GPT-4 액세스, 명령어 실행을 제공합니다.
- Cursor 설정 열기 __CAPGO_KEEP_0__을 누르세요.
Command+,(Mac) 또는Ctrl+,(Windows)에서

- AI 모델 사용을 허용하세요. — AI 기능이 활성화되어 있는지 확인하세요.

- 선택한 모델을 선택하세요. — Claude 또는 GPT-4를 선택하세요.

- 명령 실행을 허용하세요. — __CAPGO_KEEP_0__을 실행하는 커서를 활성화하여 명령을 자동으로 실행하세요:

커서에서 __CAPGO_KEEP_0__ 저장소를 클론하세요
- 커서에서
Shift+Command+P(Mac) 또는Shift+Ctrl+P(Windows) 키를 눌러 명령 팔레트를 열어보세요 - ‘clone’이라고 입력하고 Git: Clone“
- GitHub 저장소 URL을 붙여넣으세요:
https://github.com/YOUR-USERNAME/your-lovable-app.git - 프로젝트를 저장할 폴더를 선택하세요

- 커서에서 클론하세요

3단계 — 의존성 설치 및 로컬 실행
방법 1: 커서 AI 사용 (권장)
- 커서의 AI 탭을 열기 위해
Command+K(Mac) 또는Ctrl+K(Windows) - 다음 명령어를 입력하세요:
Install Homebrew, Node.js and npm on my system, then install dependencies and run the dev server
AI는 자동으로 운영 체제를 감지하고 Node.js를 설치하고 npm install, 그리고 npm run dev.

홈브루 설치
방법 2: 수동 설치 Shift+Command+T (Mac) 또는 Shift+Ctrl+T (Windows)에서, 다음을 수행하세요:
macOS를 위한:
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
brew install node
cd your-lovable-app
npm install
npm run dev
Windows를 위한:
- 다운로드할 24 LTS 설치 프로그램을 nodejs.org
- 설치 프로그램을 실행하세요.
- 터미널을 열고 다음 명령어를 실행하세요:
cd your-lovable-app
npm install
npm run dev

로컬에서 Lovable 앱을 실행하는 경우 일반적입니다. http://localhost:8080 또는 http://localhost:5173 — 터미널이 출력하는 주소로 사용하세요.
누르세요 Ctrl + C 개발 서버를 중지하려면 준비가 끝났을 때
✅ 성공: 브라우저에서 앱이 열리고 UI가 작동합니다.
4단계 — 정적 프로덕션 빌드 준비
Capacitor는 네이티브 플랫폼을 추가하기 전에 프로덕션 빌드를 필요로 합니다.
리액트 + 비트 (가장 사랑받는 앱)
방법 1: 커서 AI 사용 (권장)
누르세요 Command+K (맥) 또는 Ctrl+K (Windows)과 물어보세요:
Configure vite.config for Capacitor mobile deployment with base './' and production build to dist
Method 2: 수동 구성
확인 vite.config.ts relatively base를 사용하므로 native WebView 내부에 assets가 로드됩니다:
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({
plugins: [react()],
base: './',
build: {
outDir: 'dist',
},
})
빌드 및 확인:
npm run build
Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요: dist/ Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요: index.html Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요:

Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요:
Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요:
Add a static export script to package.json and configure next.config.js for mobile export with Capacitor
Next.js로 빌드된 프로젝트의 경우 Cursor에게 물어보세요: 다음 Next.js 앱을 모바일로 변환하세요. __CAPGO_KEEP_0__를 사용하여 next.config 설치 후 __CAPGO_KEEP_0__를 사용하세요. webDir: 'out' Capacitor 대신 dist.
✅ 성공: 정적 빌드 폴더가 존재합니다 (dist/ 또는 out/)에 index.html.
5단계 — Capacitor와 네이티브 플랫폼을 추가하세요.
Capacitor는 웹 앱을 실제 iOS 및 Android 셸에 감싸줍니다 — 다시 작성할 필요가 없습니다.
방법 1: Cursor AI를 사용하여 (권장)
클릭 Command+K (Mac) 또는 Ctrl+K (Windows)와 물어보세요:
Install Capacitor CLI, initialize it for my app with webDir dist, and add iOS and Android platforms
AI는 앱 이름과 bundle ID 를 물어볼 것입니다. (예: __CAPGO_KEEP_0__ 초기화 com.yourcompany.myapp).

설치 시에:
npm install @capacitor/core @capacitor/cli
npx cap init
입력 예시
| 예시로 입력하세요. | __CAPGO_KEEP_0__ | Notes |
|---|---|---|
| 앱 이름 | My Lovable App | 앱 아이콘 아래에 표시 |
| App Package ID | com.yourcompany.myapp | 역방향 도메인 스타일 — 게시 후 변경할 수 없음 |
| 웹 자산 디렉토리 | dist |
사용 out Next.js 정적 내보내기 |
선택한 패키지 ID가 실제로 소유하고 있는지 확인. __CAPGO_KEEP_0__: ios/ Bundle IDs는 전 세계적으로 고유합니다. __CAPGO_KEEP_0__를 사용하는 도메인을 제어하는 도메인에 기반한 역 도메인 ID를 처음부터 사용하세요. 나중에 변경하면 __CAPGO_KEEP_0__를 찾고 교체해야 하는 작업이 필요합니다. android/ and
npm run build
npm install @capacitor/ios @capacitor/android
npx cap add ios
npx cap add android
npx cap sync

Capacitor 플랫폼이 추가되었습니다.
__CAPGO_KEEP_0__를 구성합니다.
방법 1: Cursor AI를 사용하는 방법 (권장)
Update capacitor.config.ts to use dist as webDir and set up for HTTPS
Cursor에게 물어보세요. out Next.js 정적 내보내기의 경우 Cursor에게 그것을 사용하도록 요청하세요.
대신.
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.yourcompany.myapp',
appName: 'My Lovable App',
webDir: 'dist',
server: {
androidScheme: 'https',
},
};
export default config;
방법 2: 수동 구성
빌드 및 Sync
Cursor에게 말하세요:
Build the production web app and sync it with Capacitor platforms
방법 2: 수동 명령
npm run build
npx cap sync

프로젝트가 다음과 같이 보입니다:
your-lovable-app/
├── android/ ← native Android project
├── ios/ ← native iOS project
├── dist/ ← built web app (or out/ for Next.js)
├── src/ ← your Lovable app code
├── capacitor.config.ts
└── package.json
CocoaPods가 필요하지 않습니다. Capacitor 8은 iOS 의존성을 자동으로 Swift Package Manager를 사용합니다.
✅ 성공: ios/ 및 android/ 폴더가 나타나고 터미널은 Sync finished.
6단계 — 프로젝트를 확인하세요: .gitignore
Capgo 빌더는 Git 저장소에서 컴파일하므로 ios/ 및 android/ must be committed. A common mistake is ignoring them at the repo root.
Confirm:
- 이름
.gitignore총나node_modulesanddist구세요 (the cloud rebuilds 총나총세요)distand ios/총나총세요 총세요 주세요android/not ignored ignored
✅ 성공: git status shows ios/ and android/ 준비된 커밋 (무시되지 않음).
Step 7 — Commit and Push
git add .
git commit -m "Add Capacitor and native iOS/Android platforms"
git push
✅ 성공: GitHub 리포지토리가 ios/ and android/ 폴더를 보여줍니다.
Step 8 — Capgo 빌더를 사용하여 Store-Ready Binaries를 빌드합니다.
Mac이나 local Xcode/Android Studio pipeline가 필요하지 않습니다. Capgo Builder iOS 및 Android 빌드를 클라우드에서 컴파일, 서명, 제출할 수 있습니다.
Capgo 빌더를 설정하세요.
npx @capgo/cli@latest login
npx @capgo/cli@latest init
npx @capgo/cli@latest build init --platform ios
npx @capgo/cli@latest build init --platform android
서명 인증서를 한 번만 저장하세요. 도움이 필요하시면 무료 도구를 사용하세요:
- iOS 인증서 생성기
- 안드로이드 키스토어 생성기
- iOS UDID 찾기 iPhone 개발 빌드를 등록하세요.
보기 인증서 관리 및 Windows에서 iOS 빌드.
클라우드 빌드 요청
npm run build
npx cap sync
npx @capgo/cli@latest build com.yourcompany.myapp --platform ios --build-mode release
npx @capgo/cli@latest build com.yourcompany.myapp --platform android --build-mode release
터미널에서 로그 스트림이 빌드됩니다. App Store Connect가 구성되면 iOS 빌드는 TestFlight로 자동으로 업로드할 수 있습니다.
실기기에서 설치:
- iOS: TestFlight (권장) 또는 기기 UDID가 등록된 개발 빌드
- Android: Google Play 내부 테스트 트랙 또는 서명된 릴리스 APK/AAB
✅ 성공: 서명된 빌드가 완료되고 실기기에서 설치할 수 있습니다.
9단계 — 선택 사항: Xcode 또는 Android Studio에서 로컬 테스트
Mac이 있거나 클라우드 빌드 전에 에뮬레이터 테스트를 원한다면:
iOS
방법 1: Cursor AI를 사용하여 (권장)
Open the iOS project in Xcode
Method 2: 수동 명령어
npx cap open ios

첫 번째 Xcode 설정:
- 디바이스 드롭다운에서 선택할 수 있는 시뮬레이터를 선택하십시오 (예: iPhone 15)
- 실제 장치에 대한 경우: 자동으로 서명 관리 그리고 Apple Developer 팀을 선택하십시오
- ▶️ 재생 버튼을 클릭하십시오 — 첫 번째 빌드는 5–10분 정도 소요됩니다

Android에 대한 경우
Method 1: Cursor AI를 사용하는 방법 (권장)
Open the Android project in Android Studio
Method 2: 수동 명령어
npx cap open android

Android Studio의 첫 번째 설정:
- SDK 패키지를 설치하라는 메시지가 나타나면 누른다.
- Device Manager에서 에뮬레이터를 생성 (예: Pixel 6, API 33+)
- ▶️ 녹색 버튼을 클릭 — 첫 번째 빌드는 5-15분 정도 소요된다.

일상적인 디버깅을 위해 로컬 IDE를 사용한다. signed release binaries가 필요할 때는 Capgo 빌더를 사용한다. 성공:
✅ 시뮬레이터 또는 에뮬레이터에서 앱이 열리고 사랑스러운 콘텐츠가 표시된다. 10 단계 — Live Reload (개발) 사용을 활성화한다.
__CAPGO_KEEP_0__
속도 향상을 위해 로컬 개발 서버에 접근할 수 있는 네이티브 셸을 지시하세요.
방법 1: Cursor AI 사용하기 (권장)
Cursor에게 말하세요.
Set up live reload for Capacitor development with my local IP address
방법 2: 수동 설정
- 로컬 IP 주소를 찾으세요.
# macOS
ipconfig getifaddr en0
# Windows
ipconfig
- 업데이트
capacitor.config.ts:
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.yourcompany.myapp',
appName: 'My Lovable App',
webDir: 'dist',
server: {
url: 'http://YOUR_IP_ADDRESS:5173',
cleartext: true,
},
};
export default config;
포트 사용 8080 또는 3000 그것이 출력되면 npm run dev 적용하세요.
- 실시간 리로드 활성화됨.
npx cap copy

✅ 성공: code의 웹 편집은 기기 또는 시뮬레이터에서 즉시 반영됩니다.
11 단계 — 네이티브 기능 추가: 카메라
Capacitor 플러그인은 자바스크립트가 실제 기기 기능을 호출할 수 있도록 해줍니다. 사용자가 사진을 찍을 수 있도록 카메라 플러그인을 추가하겠습니다. — 브라우저 탭에서는 신뢰할 수 없는 방법으로 사진을 찍을 수 없습니다.
1. 방법: Cursor AI 사용 (권장)
Cursor에게 말하세요:
Add the Capacitor Camera plugin with iOS and Android permissions and a button to take a photo
2. 방법: 수동 설치
npm install @capacitor/camera
npx cap sync
iOS — ios/App/App/Info.plist top-level 내 <dict>:
<key>NSCameraUsageDescription</key>
<string>This app uses the camera to take photos.</string>
Android — <manifest> Native 기능이 추가되었습니다. android/app/src/main/AndroidManifest.xml:
<uses-permission android:name="android.permission.CAMERA" />
import { Camera, CameraResultType } from '@capacitor/camera';
async function takePhoto() {
const photo = await Camera.getPhoto({
quality: 90,
resultType: CameraResultType.Uri,
});
return photo.webPath;
}

성공: 카메라 __CAPGO_KEEP_0__ 빌드 및 오류 없이 완료되었습니다. 12 단계 — Capgo Live Updates 추가
✅ 네이티브 변경은 일반적으로 앱 스토어 검토를 거칩니다. code Live Updates npx cap sync __CAPGO_KEEP_0__ Live Updates는 앱의 웹层(HTML, CSS, JS, 이미지)로 변경을 실시간으로 전송합니다.
Step 12 — Add Capgo Live Updates
Adding a plugin requires a Capgo Live Updates through __CAPGO_KEEP_0__ Builder before it works on devices.
Install the updater in your first release so you’re never stuck waiting on review when you need to ship a fix.
npm install @capgo/capacitor-updater
npx cap sync
추가하기 capacitor.config.ts:
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.yourcompany.myapp',
appName: 'My Lovable App',
webDir: 'dist',
plugins: {
CapacitorUpdater: {
autoUpdate: true,
},
},
};
export default config;
앱의 진입점에서 초기화하세요 (예: src/main.tsx):
import { CapacitorUpdater } from '@capgo/capacitor-updater';
void CapacitorUpdater.notifyAppReady();
커밋, 푸시, 새로운 Capgo 빌더 빌드를 실행하여 업데이터 SDK이 네이티브 셸에 존재하도록 하세요.
출시 후 웹 번들 업로드:
npm run build
npx @capgo/cli@latest bundle upload --channel production
✅ 성공: 업데이터 플러그인은 설치되어 notifyAppReady() 시작 시 실행됩니다.
13 단계 — 라이브 업데이트와 상태 바 간격을 수정하기
실제 iPhone에서, 헤더는 시계와 배터리와 함께 상태바 아래에 위치할 수 있습니다. __CAPGO_KEEP_0__는 모던 UI를 지원하기 때문에, 앱은 안전 영역의 insets를 존중해야 합니다. the status bar (clock and battery). Modern Capacitor draws edge-to-edge, so your app must respect 1. 확인: env(safe-area-inset-top), -bottom, -left, -right.
2. 상단 헤더를 고정하세요 pt-6— 웹 패딩을 유지하고 notch가 있는 기기에서 성장하세요:
Cursor 또는 Lovable에서 물어보세요. viewport-fit=cover Confirm index.html:
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
in Fix top headers max() — use
/* Before */
padding-top: 1.5rem;
/* After */
padding-top: max(1.5rem, env(safe-area-inset-top));
to keep web padding and grow on notched devices:
모바일에서 앱 콘텐츠는 상단 상태栏 아래에서 실행됩니다. 각 페이지 헤더의 상단 패딩을 추가하여
env(safe-area-inset-top)기존 패딩을 최소값으로 유지하는max()3. OTA 배포를 통해 수정을 배포하세요.
— 이건 순수한 CSS, 원시 재구축이 필요하지 않습니다: 디바이스에서 앱을 강제 종료하고, 다시 열고, ~15-30초 기다리며 다시 열어보세요. 헤더는 상태栏 아래에 위치해야 합니다 — 스토어 리뷰 없이 수정되었습니다.
git add .
git commit -m "Fix top safe area on mobile"
git push
npm run build
npx @capgo/cli@latest bundle upload --channel production
성공:
✅ 상단 콘텐츠는 OTA 배포 패키지가 적용된 후 상태栏을 지웁니다. 더 깊은 레이아웃 작업을 위해
@__CAPGO_KEEP_0__/tailwind-__CAPGO_KEEP_1__ @capgo/tailwind-capacitor __CAPGO_KEEP_0__ edge-to-edge display For deeper layout work, see @Capacitor/tailwind-__CAPGO_KEEP_1__ and Capacitor edge-to-edge display.
Step 14 — 앱 목록 준비
앱이 완성되었습니다. 설치가 가능하고, 즉시 업데이트를 푸시할 수 있습니다. 공공 스토어에 출시하는 것은 대부분의 경우 서류 작업입니다:
- 앱 아이콘 — iOS는 1024×1024px, 투명도 없음, Google Play는 512×512px
- 스크린샷 — 애플은 iPhone 6.9“ (1320×2868px) 스크린샷을 요구합니다
- 앱 이름, 부제, 설명, 키워드
- 개인 정보 보호 정책 URL — 양식은 모두의 콘솔에서 필요합니다, 무료 앱도 포함
- 연령 등급 — 각 콘솔에서 설문조사
- 데이터 수집 공개 애플 개인정보 영양표 레이블 및 구글 데이터 안전
방법 1: 커서 AI 사용 (권장)
Set up app icons and splash screens for my Capacitor app
방법 2: 수동 설정
npm install -D @capacitor/assets
# Add assets/icon.png (1024x1024) and assets/splash.png (2732x2732)
npx capacitor-assets generate
npx cap sync

‘live’ 전 남은 것:
- 구글 플레이 폐쇄 테스트 (2023년 11월 13일 이후 개인 계정): 14일 연속 12명 이상의 테스터가 생산 액세스 권한을 얻기 전에.
- 제출 검토 —— 애플 ~3–5일, 구글 ~3–7일 테스트 요구 사항을 충족한 후.
자세한 체크리스트를 보려면 첫 번째 앱 검토 안내서 를 참조하십시오.
일반 오류 (및 해결 방법)
Could not find the web assets directory: ./dist— 실행npm run build전에npx cap add또는npx cap sync. framework의 출력과 일치하는webDir을 확인하세요 (capacitor.config.tsVite의 경우distNext.js의 정적 내보내기 경우).out“이 앱 ID …은 사용할 수 없습니다”- — Bundle ID는 전 세계적으로 고유합니다. 제어하는 역방향 도메인 ID를 선택하세요. iOS 빌드가 Bundle ID를 변경한 후 실패합니다.
- __CAPGO_KEEP_0__ — native 프로젝트에서 사용하는 ID는 Apple App Store Connect와 일치해야 합니다. Find-and-replace를 사용하여
ios/andandroid/, commit, rebuild. - , commit, rebuild. 화면이 하얀색으로 뜨는 문제
base: './'— Vite config에서npx cap sync. - in Vite config, rebuild, and run status bar 아래의 콘텐츠
viewport-fit=cover— Addenv(safe-area-inset-top)and - padding (Step 13). debug 모드에서 APK를 서명한 경우 Google Play에서 거부합니다. 릴리즈 빌드와 자신의 키스토어로 서명한 빌드를 사용하세요.
- 배포 거부 — 버전이 이미 존재합니다 — 네이티브 프로젝트의 버전/빌드 번호를 업데이트하고 다시 빌드하세요.
Capgo Capgo 빌더 문제를 참조하세요 네이티브 빌드 문제 해결 및 라이브 업데이트 디버깅.
결론
웹 앱을 네이티브 iOS 및 Android로 만들었습니다. — 클라우드에서 Mac 없이, 실제 카메라 기능과 레이아웃 수정을 오버 더 에어로 배포했습니다. 그게 어려운 부분이 다 끝났습니다.
다음 단계
- Capgo Capgo Live Updates — 스토어 리뷰를 기다리지 않고 UI 및 복사본 수정을 배포하세요.
- Capgo Capgo Builder — CI에서 릴리즈 빌드를 자동화하세요.
- Capgo 플러그인 디렉토리 — 생체 인식, 푸시 알림, 위치 정보, 등
- 관련 문서: Base44 to mobile · Bolt.new to mobile
Capgo 계정에 무료로 가입하세요. Live Updates 및 클라우드 네이티브 빌드를 활성화하기 위해.
자원
Capacitor을 사용하여 __CAPGO_KEEP_1__ 앱을 iOS와 Android로 변환하는 데 계속 가기
__CAPGO_KEEP_0__을 사용 중이라면 Capacitor을 사용하여 __CAPGO_KEEP_1__ 앱을 iOS와 Android로 변환하기 __CAPGO_KEEP_0__을 __CAPGO_KEEP_1__과 연결하여 Capgo 플러그인 디렉토리 Capgo 플러그인 디렉토리 내의 제품 워크플로우 Capgo에서 개발한 Capacitor 플러그인 Capgo에서 개발한 Capacitor 플러그인의 구현 세부 사항 Capgo 네이티브 빌드 제품 워크플로우에서 Capgo 네이티브 빌드를 위한 윈도우에서 iOS를 빌드하세요 Mac이 없는 경우 클라우드 iOS 빌드를 위한