svelte

[svelte] capacitor, sveltekit을 이용하여 모바일 앱 만들기

밍글링글링 2022. 6. 17.
728x90

기존 실행되는 sveltekit 프로젝트에서 adapter가 달려있다고 가정한다.

capacitor 를 이용할 것이다.

npm install -D @capacitor/core @capacitor/cli @capacitor/android @capacitor/filesystem @capacitor/geolocation

위 명령어로 capacitor 등등 옵션 등을 install 한다.

그 이후, 

npx cap init

위 명령어를 입력하여, capacitor.config.json 파일을 생성시킨다.

{
  "appId": "com.example.app",
  "appName": "javamin",
  "webDir": "build",
  "bundledWebRuntime": false,
  "server": {
    "url": "https://javamin.tistory.com",
    "cleartext": true
  }
}

위 내용은 capacitor.config.json의 내용인데 server 이 후로 진행되는 코드는 url과 연결되어 앱으로 만들어진다.

 

npx cap add android

Android를 추가하고,  

npm run build

빌드를 한다. 하지만, build 시에 index.html 파일이 존재하지 않아서  동기화가 되지 않는다.

npx cap sync

위 명령어로 동기화를 한 후, 

#1
npx cap open android

#2
npx cap run

1. android studio 가 켜져서 에뮬레이터가 실행된다.

2. vscode 에서 에뮬레이터를 실행한다.

 

728x90

'svelte' 카테고리의 다른 글

Svelte4, Sveltekit2 으로 마이그레이션  (0) 2023.12.29
[SVELTE] 프로젝트 생성  (0) 2022.05.10

댓글