__CAPGO_KEEP_0__을 사용하여 iOS와 Android로 사랑하는 앱을 변환하세요.
소개 로블로블
로블로블은 AI 앱 빌더로, 몇 분 만에 프롬프트를 사용하여 작동하는 React 앱으로 변환합니다. 브라우저에서 빠르게 배포할 수 있지만, App Store와 Google Play에 배포하고 홈 스크린에 있는 원래 네이티브 앱과 같은 앱을 원한다면? Capacitor, 클라우드에서 서명된 iOS 및 Android 바이너리를 빌드합니다. Capgo 빌더 __CAPGO_KEEP_0__ Live Updates Capgo Live Updates.
커서 를 사용합니다 — AI는 터미널 명령어를 대부분 자동으로 실행할 수 있습니다. 만약 수동으로 입력하지 않으려면. 시간이 걸립니다:
처음에는 약 1-2시간 정도 소요되며, 주로 계정 설정과 클라우드 빌드 기다림이 대부분입니다. 마지막에는 다음과 같은 결과를 얻을 수 있습니다:
클라우드에서 빌드된 네이티브 iOS 및 Android 앱 — Xcode 또는 Android Studio는 메인 경로에 없습니다.
- __CAPGO_KEEP_0__
- 실기기에서 실행 중인 앱 (TestFlight, 직접 설치, 또는 Play 내부 테스트)
- 자연스럽게 작동하는 카메라 기능
- 실시간 업데이트: UI 및 CSS 수정 사항은 스토어 리뷰 없이 배포
사전 요구 사항
| 요구 사항 | 세부 사항 |
|---|---|
| 컴퓨터 | Mac, Windows, 또는 Linux — 클라우드 빌드는 모든 OS에서 작동 |
| code 에디터 | 커서 (권장) 또는 VS Code |
| Node.js | 24 LTS (최신 — nodejs.org) |
| Git | To clone your Lovable repo from GitHub |
| Capgo 계정 | 무료 가입 — cloud builds and Live Updates |
게시를 위해 공개적으로 게시하는 경우:
| 항목 | 비용 |
|---|---|
| Apple Developer Program | $99/year |
| 구글 플레이 콘솔 | $25 한 번의 비용 |
| Cursor Pro | $20/월 (선택 사항이지만 AI 명령 실행을 위해 권장) |
| Capgo | Capgo에 PR 제출하기 |
$20/월 (선택 사항이지만 AI 명령 실행을 위해 권장)
| 무료 티어 사용 가능; 생산 규모에 대한 유료 계획 | 선택 사항 (로컬 시뮬레이터만): |
|---|---|
| 도구 | 왜 |
| Xcode (~15 GB, macOS 전용) | 안드로이드 시뮬레이터 |
이 가이드의 주요 경로에서는 클라우드에서 빌드하고 실제 장치에 설치하지만 시뮬레이터를 사용하지 않습니다.
사랑스러운 앱과 프레임워크에 대한 빠른 주의
code에 접근하기 전에 알아야 할 점은 로블로브가 생성하는 웹 앱의 종류가 모바일 wrapping에 영향을 줍니다..
오랫동안 로블로브의 기본 설정은 리액트 + 비트(single-page app, SPA)로2026년 5월부터 새로 생성된 로블로브 앱은 TanStack Start를 사용하여 서버 사이드 렌더링(server-side rendering, SSR)으로 기본 설정합니다. SSR은 웹에서 좋지만 Capacitor는 정적 빌드를 wrapping합니다. 정적 빌드는 HTML, CSS, JavaScript 파일의 폴더 index.html __CAPGO_KEEP_0__
Capacitor __CAPGO_KEEP_0__.
__CAPGO_KEEP_0__
- __CAPGO_KEEP_0__ __CAPGO_KEEP_0__ __CAPGO_KEEP_0__ __CAPGO_KEEP_0__
dist/__CAPGO_KEEP_0__ - __CAPGO_KEEP_0__ __CAPGO_KEEP_0__
index.html. - __CAPGO_KEEP_0__ 사용 정적 내보내기 — 출력은
out/대신dist/.
Whatever framework you use, point Capacitor’s webDir 's dist.
Step 1 — Export Your Lovable App to GitHub
Lovable keeps your code in its editor until you connect GitHub.
- 로 내보내세요.
- 로블로브는 에 저장합니다. 로블로브 프로젝트를 브라우저에서 열어보세요. Git 좌측 메뉴에서
- 선택 GitHubLovable을 인증하고 계정 연결
- Lovable은 앱을 자동으로 저장소와 연결




✅ 성공: 방문 github.com/YOUR-USERNAME/your-app 앱의 code을 보여줍니다.
2단계 — 커서와 프로젝트를 클론하세요
앱의 code를 로컬에서 작업하기 전에 code 편집기를 설치해야 합니다. 우리는 CursorAI가 지원하는 편집기입니다. 커서에서는 터미널 명령어를 자동으로 실행할 수 있습니다.
Cursor를 다운로드하고 설치하세요
- cursor.sh 운영 체제에 맞는 버전을 다운로드하세요 Cursor를 설치하는 설치 마법사를 따라하세요
- Cursor를 열어보세요
- Cursor를 시작하세요

Cursor 설정을 AI 개발에 맞게 구성하세요
최고의 경험을 위해 Cursor를 설정하세요. 시작하기 전에:
- Cursor 플랜을 구매하세요 Cursor는 무료 티어를 제공하지만, 프로 플랜 ($20/월)은 무제한 AI 완성, Claude 및 GPT-4에 대한 접근, 명령 실행을 제공합니다.
- Cursor 설정을 열어보세요 Mac의 경우
Command+,Windows의 경우Ctrl+,Cursor 설정

- AI 기능이 활성화되어 있는지 확인하세요: 모델에 대한 허용

- 모델을 선택하세요 — Claude 또는 GPT-4를 선택하여 최상의 결과를 얻으세요:

- 명령어 실행을 허용하세요 — 커서를 통해 명령어를 실행할 수 있도록 허용하세요:

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

- Cursor는 프로젝트를 복사하고 열어줍니다

3단계 — 의존성 설치 및 로컬 실행
방법 1: Cursor AI 사용 (권장)
- Cursor의 AI 탭을 열기 위해
Command+K(맥)Ctrl+K(윈도우) - 다음 명령어를 입력하세요:
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에서 installer를 다운로드하세요 설치
- 설치 프로그램을 실행하세요.
- 터미널을 열고 실행하세요:
cd your-lovable-app
npm install
npm run dev

로벌 앱은 일반적으로 http://localhost:8080 또는 http://localhost:5173 Capacitor live-update 대안
Capacitor live-update 대안을 비교하는 페이지. 역할: 장기 마케팅 또는 법적 문단. 보존: Capgo 제품/브랜드 및 개발자 용어. 메시지 키: alternatives_cta_questions (대안 CTA 질문). | Appflow 비교/이동 마케팅 복사본. 역할: 장기 마케팅 또는 법적 문단. 보존: Capgo 제품/브랜드 및 개발자 용어. 메시지 키: appflow_cta_questions (Appflow CTA 질문). | Capawesome 비교 페이지. 역할: 장기 마케팅 또는 법적 문단. 보존: Capgo 제품/브랜드 및 개발자 용어. 메시지 키: capwesome_cta_questions (Capwesome CTA 질문). | 컨설팅 서비스 페이지. 역할: 섹션 서브 타이틀 또는 태그 라인. 보존: Capgo 제품/브랜드 및 개발자 용어. 메시지 키: consulting_faq_subtitle (컨설팅 FAQ 서브 타이틀). | Appflow 비교/이동 마케팅 복사본. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 보존: Capgo 제품/브랜드 및 개발자 용어. 메시지 키: appflow_plugins_or (Appflow 플러그인 또는) Ctrl + C 터미널이 출력한 주소로 사용하세요.
✅ 종료 종료
성공:
브라우저에서 앱이 열리고 UI가 작동합니다. 스텝 4 — 정적 프로덕션 빌드를 준비하세요. Capacitor는 네이티브 플랫폼을 추가하기 전에 프로덕션 빌드를 필요로 합니다.
React + Vite (가장 사랑받는 앱들)
Method 1: Cursor AI 사용 (추천)
클릭 Command+K (Mac) 또는 Ctrl+K (Windows)에서 다음과 같이 묻습니다:
Configure vite.config for Capacitor mobile deployment with base './' and production build to dist
Method 2: 수동 설정
확인 vite.config.ts relative 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
native WebView 내부에 assets를 로드하는 relative base를 사용하여: dist/ 빌드 및 확인: index.html root에 있는 폴더를 확인하십시오.

Next.js를 사용하는 이전 프로젝트
Next.js를 사용하는 리포지토리가 있다면 Cursor에게 물어보세요:
Add a static export script to package.json and configure next.config.js for mobile export with Capacitor
또는 모바일로 변환하는 방법 전체 next.config 설정을 사용하세요 webDir: 'out' Capacitor 대신 dist.
✅ 성공: 정적 빌드 폴더가 존재합니다 (dist/ 또는 out/] index.html.
Step 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 com.yourcompany.myapp).

Method 2: 수동 설치
npm install @capacitor/core @capacitor/cli
npx cap init
When prompted:
| Prompt | Example | Notes |
|---|---|---|
| 앱 이름 | My Lovable App | 앱 아이콘 아래에 표시됨 |
| 앱 패키지 ID | com.yourcompany.myapp | 역방향 도메인 스타일 — 게시 후 변경할 수 없음 |
| 웹 자산 디렉토리 | dist |
사용 out Next.js 정적 내보내기 |
제어하는 패키지 ID를 선택하세요. Bundle ID는 전 세계적으로 고유합니다. 시작부터 제어하는 도메인에 기반한 역 도메인 ID를 사용하세요. 이후 변경하면 모든 ios/ 페이지/영역: Capgo 마케팅 웹사이트. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 보이는 곳: trust.astro 페이지. 메시지 키 `and` (And). android/ 페이지/영역: Capgo 마케팅 웹사이트. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 보이는 곳: trust.astro 페이지. 메시지 키 `and` (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 대신.
방법 2: 수동 구성
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;
빌드 및 Sync
방법 1: Cursor AI 사용 (권장)
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.
Step 6 — .gitignore
Capgo ios/ 빌더는 Git 저장소에서 컴파일되므로 android/ 그리고해야합니다.
확인:
- 루트
.gitignore무시node_modules그리고dist(웹 빌드 중에는 클라우드가 다시 빌드합니다.)distduring web builds) ios/그리고android/그것들 아니 무시
✅ 성공: git status 보여 ios/ 그리고 android/ 준비된
Step 7 —
git add .
git commit -m "Add Capacitor and native iOS/Android platforms"
git push
✅ Commit Your GitHub repo shows the ios/ 성공: android/ 폴더.
8단계 — Capgo Builder를 사용하여 Capgo 빌더로 저장할 준비가 된 바이너리 빌드를 빌드합니다.
Mac이나 로컬 Xcode/Android Studio pipeline이 필요하지 않습니다. Capgo Builder Capgo Builder
Set up Capgo Builder
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
Capgo Builder
- Capgo Builder
- 클라우드에서 iOS 및 Android 빌드를 컴파일, 서명, 제출할 수 있습니다.
- Capgo Builder를 설정하세요. 인증서를 한 번만 저장하세요. 인증서를 생성하는 데 도움이 필요하면 무료 도구를 사용하세요:
iOS 인증서 생성기 인증 관리 그리고 윈도우에서 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
✅ 성공: 서명된 빌드가 완료되고, 실기기에서 설치할 수 있습니다.
Step 9 — Optional: Capgo를 사용하여 로컬에서 iOS 앱으로 변환하기
Mac을 가지고 있거나 클라우드 빌드 전에 에뮬레이터 테스트를 원한다면:
iOS
Method 1: Cursor AI를 사용하는 방법 (권장)
Open the iOS project in Xcode
Method 2: 수동 명령어
npx cap open ios

첫 번째 Xcode 설정:
- 시뮬레이터를 선택하세요 (예: iPhone 15)
- 실제 장치에 대해: 자동으로 서명 관리를 활성화하고 Apple Developer 팀을 선택하세요 ▶️ Play 버튼을 클릭하세요 — 첫 번째 빌드는 5–10분 정도 소요됩니다
- For real devices: enable Automatically manage signing and select your Apple Developer team

Android용으로
방법 1: Cursor AI를 사용하세요 (권장)
Open the Android project in Android Studio
방법 2: 수동 명령어 사용
npx cap open android

첫 번째 Android Studio 설정:
- SDK 패키지를 설치하십시오 (필요한 경우)
- 디바이스 매니저에서 에뮬레이터를 생성하세요 (예: Pixel 6, API 33+)
- 녹색 ▶️ 실행 버튼을 클릭하세요 — 첫 번째 빌드는 5–15분 소요됩니다.

__CAPGO_KEEP_0__ 빌더를 사용하여 개발을 진행하세요. Capgo Capgo를 사용하여 모바일 앱으로 변환할 때 signed release binaries가 필요할 때.
✅ 성공: 시뮬레이터 또는 에뮬레이터에서 앱이 열리고 Lovable 콘텐츠가 표시됩니다.
10 단계 — Live Reload (개발) 활성화:
개발 속도를 높이기 위해 로컬 개발 서버에 대한 native shell을 지시하세요.
방법 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 또는 (context: HTML text fragment from a longer Capgo UI string (parent key `alternatives_cta_questions`). Page/area: Capacitor live-update alternatives comparison page. Role: Long marketing or legal paragraph. Seen in: page alternatives.astro. Preserve Capgo product/brand and developer terms exactly. Message key `alternatives_cta_questions` (Alternatives CTA Questions). | HTML text fragment from a longer Capgo UI string (parent key `appflow_cta_questions`). Page/area: Appflow comparison / migration marketing copy. Role: Long marketing or legal paragraph. Seen in: page ionic-appflow.astro. Preserve Capgo product/brand and developer terms exactly. Message key `appflow_cta_questions` (Appflow CTA Questions). | HTML text fragment from a longer Capgo UI string (parent key `capwesome_cta_questions`). Page/area: Capawesome comparison page. Role: Long marketing or legal paragraph. Seen in: page capwesome.astro. Preserve Capgo product/brand and developer terms exactly. Message key `capwesome_cta_questions` (Capwesome CTA Questions). | HTML text fragment from a longer Capgo UI string (parent key `consulting_faq_subtitle`). Page/area: Consulting services page. Role: Section subtitle or tagline. Seen in: page consulting.astro. Preserve Capgo product/brand and developer terms exactly. Message key `consulting_faq_subtitle` (Consulting FAQ Subtitle). | Page/area: Appflow comparison / migration marketing copy. Role: Short UI label or navigation item. Seen in: page ionic-appflow.astro, page ionic-enterprise-plugins.astro, page solutions/ionic-enterprise-plugins.astro. Message key `appflow_plugins_or` (Appflow Plugins Or). ) 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 상위 레벨 내 <dict>:
<key>NSCameraUsageDescription</key>
<string>This app uses the camera to take photos.</string>
안드로이드 내부에 추가 <manifest> 내 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__ 빌더를 통해 기기에서 작동하기 전에. through Capgo Builder before it works on devices.
✅ 카메라 __CAPGO_KEEP_0__ 컴파일하고 Camera code compiles and npx cap sync __CAPGO_KEEP_0__
Step 12 — Capgo Live Updates
모든 네이티브 변경은 일반적으로 앱 스토어 리뷰를 거칩니다. Capgo Live Updates context
__CAPGO_KEEP_0__ Live Updates __CAPGO_KEEP_0__ Live Updates
npm install @capgo/capacitor-updater
npx cap sync
__CAPGO_KEEP_0__ Live Updates 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;
__CAPGO_KEEP_0__ Live Updates src/main.tsx):
import { CapacitorUpdater } from '@capgo/capacitor-updater';
void CapacitorUpdater.notifyAppReady();
Commit, push, and run a new Capgo Builder build so the updater SDK is in the native shell.
__CAPGO_KEEP_0__ Live Updates
npm run build
npx @capgo/cli@latest bundle upload --channel production
__CAPGO_KEEP_0__ Live Updates Capgo Live Updates.
To automate this upload every time someone clicks 게시를 클릭할 때마다 업로드를 자동화하세요 Publish Automate Capgo Live Updates from Lovable with GitHub Actions.
✅ Automate __CAPGO_KEEP_0__ Live Updates from Lovable with __CAPGO_KEEP_1__ Actions __CAPGO_KEEP_0__ Live 업데이트를 __CAPGO_KEEP_1__ 액션으로 통해 Lovable에서 자동화하세요 notifyAppReady() Success:
성공:
Updater plugin is installed and 업데이터 플러그인은 설치되어 the status bar (clock and battery). Modern Capacitor draws edge-to-edge, so your app must respect 시작 시 실행됩니다. : env(safe-area-inset-top), -bottom, -left, -right.
많은 Lovable 앱은 이미 하단 inset을 처리하지만 고정된 상단 패딩을 사용합니다 (예를 들어) pt-6)에 없는 상단 inset.
1. 확인 viewport-fit=cover 에서 index.html:
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
2. 상단 헤더 고정 — max() 웹 패딩을 유지하고 notch 장치에서 성장하기 위해:
/* Before */
padding-top: 1.5rem;
/* After */
padding-top: max(1.5rem, env(safe-area-inset-top));
Cursor 또는 Lovable에서 물어보세요:
“The app content runs under the status bar at the top on mobile. Add
env(safe-area-inset-top)모바일에서 상단 상태栏 아래에 앱 콘텐츠가 실행됩니다. 각 페이지 헤더의 상단 패딩에max()을 추가하여 기존 패딩을 최소값으로 유지하세요.
3. 오버 더 에어로 픽스를 배포 — 이 CSS만으로도, 네이티브 리빌드가 필요하지 않습니다:
git add .
git commit -m "Fix top safe area on mobile"
git push
npm run build
npx @capgo/cli@latest bundle upload --channel production
앱을 기기에 강제 종료하고, 다시 열고, 약 15-30초 기다리며 다시 열어보세요. 헤더는 상태바 아래에 위치하게 됩니다 — 스토어 리뷰 없이 고쳐집니다.
✅ 성공: OTA 패키지가 적용된 후, 상단 콘텐츠는 상태바를 지워줍니다.
더 깊은 레이아웃 작업을 위해서는 @capgo/tailwind-capacitor 그리고 Capacitor edge-to-edge display.
__CAPGO_KEEP_0__ 에지 투 에지 디스플레이
14단계 — 스토어 목록 준비
- 앱이 빌드되어 설치 가능하며, 즉시 업데이트를 푸시할 수 있습니다. 공공 스토어에 출시하는 것은 주로 서류 작업입니다: 앱 아이콘
- 스크린샷 — 아이폰 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일 연속으로 테스트를 마치면 3-5일 후 애플, 3-7일 후 구글에서 검토를 시작합니다.
- 검토에 제출 — 애플: ~3–5일, 구글: ~3–7일 테스트 요구 사항을 충족하면.
자세한 내용은 첫 번째 앱 리뷰 가이드 를 참조하세요.
일반적인 오류 (그것들을 수정하는 방법)
Could not find the web assets directory: ./dist— 실행npm run build애플리케이션을 개발하기 전에npx cap add또는npx cap sync. 확인하세요webDir에서capacitor.config.tsmatches your framework output (distfor Vite,outfor Next.js static export).- “이 앱 ID …은 사용할 수 없습니다” — 앱 번들 ID는 전 세계적으로 고유합니다. 제어할 수 있는 역 도메인 ID를 선택하세요.
- iOS 빌드가 번들 ID를 변경한 후 실패합니다 — 네이티브 프로젝트의 ID는 Apple App Store Connect와 일치해야 합니다. 찾고 교체하세요.
ios/및android/, 커밋, 다시 빌드. - 시작 시 화면이 흰색으로 나타납니다. — 설정
base: './'in Vite config, rebuild, and runnpx cap sync. - 콘텐츠는 상태바 아래에 있습니다 — 추가
viewport-fit=cover및env(safe-area-inset-top)context: Capgo 마케팅 웹사이트. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. seen in: page trust.astro. Message key `and` (And). - 패딩 (13 단계) APK 디버그 모드에서 서명
- Google Play는 디버그 빌드를 거부합니다. 릴리스 빌드와 키 스토어로 서명하여 사용하십시오. 배포 거부 — 버전이 이미 존재합니다
For Capgo Builder issues, see __CAPGO_KEEP_0__ 빌더 문제에 대해서는 및 실시간 업데이트 디버깅.
결론
당신은 사랑스러운 웹 앱을 네이티브 iOS 및 Android로 빌드했습니다. - 클라우드에서 Mac 없이, 실제 카메라 기능과 레이아웃 수정을 공유하여 공중으로. 그게 어려운 부분이 다 끝났습니다.
다음 단계
- Capgo 실시간 업데이트 — 스토어 리뷰 기다리지 않고 UI 및 복사 수정을 배달합니다
- Capgo 빌더 — CI에서 릴리즈 빌드를 자동화합니다
- Capgo 플러그인 디렉토리 — 생체 인식, 푸시 알림, 위치 정보, 등
- 관련 가이드 모바일로 변환 · 볼트.new를 모바일로
Capgo 무료 계정으로 가입하세요 실시간 업데이트 및 클라우드 네이티브 빌드를 활성화하기 위해.
자원
Capacitor로 iOS와 Android로 앱을 변환하세요
만약 당신이 사용 중이라면 Capacitor을 사용하여 iOS와 Android로 앱을 변환하세요. __CAPGO_KEEP_0__을 사용하여 네이티브 플러그인 작업을 계획하세요. Capgo 플러그인 디렉토리와 연결하세요. Capgo 플러그인 디렉토리에서 제품 워크플로우를 관리하세요. Capacitor 플러그인으로 Capgo Capacitor 플러그인으로 Capgo의 구현 세부 사항을 관리하세요. Capgo 네이티브 빌드 Capgo 네이티브 빌드에서 제품 워크플로우를 관리하세요. 윈도우에서 iOS 빌드 맥 없이 클라우드 iOS 빌드를 수행하세요.