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

2022. 6. 17. 20:55·svelte
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
'svelte' 카테고리의 다른 글
  • Svelte4, Sveltekit2 으로 마이그레이션
  • [SVELTE] 프로젝트 생성
밍글링글링
밍글링글링
mingling - 밍글링, 밍글밍글링. 코드와 어우러지다. IT/ 프로그래밍/소스
    반응형
    250x250
  • 밍글링글링
    mingling
    밍글링글링
  • 전체
    오늘
    어제
    • 밍글링글링 (463)
      • Flutter (2)
      • 일상생활 (8)
        • 리뷰 (1)
        • 생활정보 (4)
        • 맛집 (0)
        • 여행 (0)
        • 모든정보 (3)
      • JAVA (126)
        • 개념 (6)
        • 예제 (115)
        • Exception (2)
      • C (1)
        • C (1)
        • C++ (0)
        • C# (0)
      • JS (29)
        • JavaScript (18)
        • JQuery (5)
        • AJax (0)
        • NODE.JS (6)
        • Angular.JS 2.0 (0)
      • WEB (87)
        • HTML (6)
        • CSS (61)
        • JSP (20)
        • JSTL (0)
      • FrameWork (8)
        • Spring (8)
        • BootStrap (0)
        • MyBATIS (0)
        • JUnit (0)
      • 외부 라이브러리 (5)
      • 공유 소스 관리 (5)
        • Git (5)
        • SVN (0)
      • 빅데이터 프로그래밍 (37)
        • Python (37)
        • R Programming (0)
      • DB (7)
        • ORACLE (0)
        • MySql (6)
      • Development Tools (7)
        • StarUML (0)
        • eXERD (0)
        • Eclipse (4)
      • SKILL (6)
        • Migration (0)
        • Security (6)
      • MicroSoft (0)
        • Excel (0)
        • Word (0)
      • Android (0)
      • Server (21)
        • Ubuntu (5)
        • Linux (15)
      • IOS (0)
      • XML (0)
      • 미디어 (0)
      • 공지사항 (3)
      • NETWORK (1)
      • 게임 (4)
        • 피파 (1)
        • 리니지M (0)
        • 배틀그라운드 (1)
        • 듀랑고 (2)
      • 세상 이슈 (6)
      • 일렉트론 (0)
      • 대회 소식 (4)
      • 업무 (2)
      • Express, Vue (6)
      • docker (11)
      • svelte (3)
      • 블록체인 (1)
      • IT (66)
      • Rust (0)
  • 블로그 메뉴

    • 홈
    • 태그
    • 미디어로그
    • 위치로그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    러스트
    proxy pass
    자바 exception
    vue 설치
    jsp include
    자바 for문
    클론코딩
    Node
    css float
    API 설계
    css table
    css transition
    리눅스 설치
    제미나이
    Java Array
    Extension Bisect
    css tb
    AI 반도체
    브라우저 자동화
    오류
    lang rust
    servlet class
    ssl 인증서 발급
    nginx
    AI 코딩 에이전트
    rust linux
    React Compiler
    자바 클래스
    gitlab 설치
    티스토리 자동화
    docker
    자바 객체 지향
    css perspective
    자바 배열
    자바 생성자
    Rust lang
    svelte
    java casting
    nginx ssl 설정
    VS Code 팁
    mysql db
    jsp parameter
    nginx ssl 적용
    ubuntu
    에디터 팁
    spring java
    SSL 인증서
    vscode
    vue cli
    프런트엔드
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.6
밍글링글링
[svelte] capacitor, sveltekit을 이용하여 모바일 앱 만들기
상단으로

티스토리툴바