sveltekit

1. vite-plugin-mkcert 설치 yarn add vite-plugin-mkcert -D npm install vite-plugin-mkcert -D 2. vite.config.js/ts 수정 import mkcert from "vite-plugin-mkcert" export default defineConfig({ plugins: [sveltekit(), mkcert()], server: { https: true, proxy: {}, }, }) 참고 : https://www.reddit.com/r/sveltejs/comments/15umlhr/how_do_you_use_sveltekit_with_https/

1. 문제 상황 저는 처음에 sveltekit + ionic + capacitor 기반으로 하이브리드 앱 개발을 하려고 했습니다. 그러나 현재 ionic에선 svelte를 공식 지원해주지 않아서 아래 라이브러리로 개발을 해야됩니다. https://github.com/Tommertom/svelte-ionic-app GitHub - Tommertom/svelte-ionic-app: Ionic UI showcase app - try Ionic UI and directly go to API or source code (Svelte, Angul Ionic UI showcase app - try Ionic UI and directly go to API or source code (Svelte, Angular, Vu..

1. appflow 연결 https://ionic.io/appflow Appflow: The Easiest Way to Build and Deploy Apps | Ionic.io Appflow is the easiest way to build and deploy amazing apps. Move faster with cloud native, live updates, app publishing, and the ability to automate it all. ionic.io 위 사이트로 들어가 회원가입을 하고 저번에 만들어준 프로젝트를 연동해 주세요. 연동후 아이폰에서 테스트하기 위해 development모드로 빌드를 하려고 하면 아래와 같이 Signing certificate가 없다고 오류가 납니다. s..

1. live reload 기능 사용하기 1. 네트워크 주소 알기 sveltekit 터미널에서 아래 명령어를 입력하고 네트워크 주소를 확인해 주세요. npm run dev -- --host 2. capacitor.config.js 수정 위에서 얻은 네트워크 주소를 capacitor config.js에 아래 코드를 추가해주시면 됩니다. const config: CapacitorConfig = { server: { url: [네트워크 주소], //끝에 /는 빼주세요. cleartext: true } } 이제 빌드하고 android와 ios를 연결해주세요! 서버를 키면 수정하고 저장할 때 바로 반영되는 live reload 기능을 체험하실 수 있습니다! 다음시간엔 xcode가 없는 사람들을 위해 appflow..

sveltekit + capacitor을 이용해 하이브리드앱을 개발할 수 있는데요. 개발한 후 아이폰으로 테스트를 하려고 하면 xcode가 필요하다며 맥북 없이는 테스트 하기 힘듭니다. 그러나 app flow를 이용하면 윈도우로도 아이폰에서 확인할 수 있습니다. 크게 1. sveltekit+ capacitor 설치 2. live reload 기능 사용하기 3. app flow 연결하고 ipa 설치 로 알려드리겠습니다. 1. Sveltekit 설치 npm init svelte@next [프로젝트명] //스벨트 킷을 설치 해줍니다. cd [프로젝트명] //프로젝트 폴더로 이동합니다 npm install //의존성 패키지를 다운로드 합니다. npm run dev //잘 작동하는지 확인합니다. 저는 스벨트킷 설..