가이드
Capacitor에서 Live Reload를 사용하는 방법
@capgo/capacitor-live-reload 사용하기
원격 Vite 개발 서버를 통해 Capacitor 앱을 라이브 리로드하는 Capacitor 플러그인
설치
bun add @capgo/capacitor-live-reload
bunx cap sync
bunx cap sync 플러그인의 네이티브 code를 네이티브 프로젝트에 복사합니다. 플러그인을 업그레이드할 때마다 다시 실행하세요.
가져오기
import { LiveReload } from '@capgo/capacitor-live-reload';
API 한눈에 보기
| 메서드 | 설명 |
|---|---|
configureServer |
이후 연결에 사용할 원격 개발 서버 설정을 저장합니다. |
connect |
아직 활성 연결이 없으면 WebSocket 연결을 설정합니다. |
disconnect |
현재 WebSocket 연결을 종료하고 자동 재연결을 비활성화합니다. |
getStatus |
현재 연결 상태를 반환합니다. |
reload |
Capacitor WebView의 전체 새로고침을 트리거합니다. |
reloadFile |
런타임이 지원하면 단일 파일/모듈을 새로고침합니다(지원하지 않으면 전체 새로고침으로 대체). |
예시
configureServer()
이후 연결에 사용할 원격 개발 서버 설정을 저장합니다.
import { LiveReload } from '@capgo/capacitor-live-reload';
const result = await LiveReload.configureServer({ url: 'https://example.com' });
console.log(result);
connect()
아직 활성 연결이 없으면 WebSocket 연결을 설정합니다.
import { LiveReload } from '@capgo/capacitor-live-reload';
const result = await LiveReload.connect();
console.log(result);
disconnect()
현재 WebSocket 연결을 종료하고 자동 재연결을 비활성화합니다.
import { LiveReload } from '@capgo/capacitor-live-reload';
const result = await LiveReload.disconnect();
console.log(result);
getStatus()
현재 연결 상태를 반환합니다.
import { LiveReload } from '@capgo/capacitor-live-reload';
const result = await LiveReload.getStatus();
console.log(result);
reload()
Capacitor WebView의 전체 새로고침을 트리거합니다.
import { LiveReload } from '@capgo/capacitor-live-reload';
await LiveReload.reload();
reloadFile()
런타임이 지원하면 단일 파일/모듈을 새로고침합니다(지원하지 않으면 전체 새로고침으로 대체).
import { LiveReload } from '@capgo/capacitor-live-reload';
await LiveReload.reloadFile({ path: 'path/to/file' });
이벤트 수신
addListener 핸들을 반환합니다. 호출하세요 handle.remove() 화면이 언마운트될 때, 또는 LiveReload.removeAllListeners() 모든 리스너를 해제하려면.
전체 레퍼런스
@capgo/capacitor-live-reload 사용하기에서 계속하기
사용 중이라면 @capgo/capacitor-live-reload 사용하기 네이티브 플러그인 작업을 계획하려면, 이를 다음 항목과 연결하세요: @capgo/capacitor-live-reload @capgo/capacitor-live-reload의 구현 세부 사항은, 시작하기 Getting Started의 구현 상세 내용은 Capgo 플러그인 디렉토리 Capgo Plugin Directory의 제품 워크플로우에 맞춰, Capgo의 Capacitor 플러그인 Capgo의 Capacitor Plugins 구현 세부 사항 및 플러그인 추가 또는 업데이트 플러그인 추가 또는 업데이트의 구현 세부 사항은.