Ionic 4 배포하기

환경 - 맥, Ionic4, angular

 

아래 3개의 명령어를 실행하세요. - angular cli가 글로벌(-g)로 설치되어 있어야 합니다.

ng build --prod  

ionic capacitor sync android 

ionic capacitor sync ios

capacitor.config.json

appId: 앱스토에서 사용될 Id 

android studio에서 열기 : ionic capacitor open android 

x-code에서 열기 : ionic capacitor open ios

Android 세팅

<!-- android/app/src/main/res/values/strings.xml app_name -->

<!-- 앱아이디 = capacitor.config.json의appId -->

<string name="app_name">PairBnB</string>
<string name="title_activity_main">PairBnB</string>
<string name="package_name">앱아이디</string>
<string name="fileprovider_authority">앱아이디</string>
<string name="custom_url_scheme">앱아이디</string>

<!-- android/app/src/main/AndroidManifest.xml -->

<!-- 앱아이디 = capacitor.config.json의appId -->

<manifest xmlns:android="..." package="앱아이디"> ... </manifest>

 

// android/app/src/build.gradle

// 앱아이디 = capacitor.config.json의appId

defaultConfig {
	applicationId "앱아이디"	
}

//versionCode, versionName을 통해서 버전을 변경할 수 있습니다.

 

퍼미션은 AndroidManifest 에서 uses-permission 테그에서 확인 할 수 있습니다.

 

iOS세팅

<!-- ios/App/App/Info.plist -->

<key>CFBundleDisplayName</key>
  <string>PairBnB</string>

X-code에서 App을 열면 오른쪽화면에서 Version을 변경할 수 있습니다.

 

아이콘 변경

 

Image Gorilla(아이콘 다양한 크기 제공)는 구글에서 쉽게 접근할 수 있습니다.

 

ios

App/App/Assets.xCss 에서 아이콘을 드래그 엔 드랍으로 변경합니다.

 

Android

App/res를 마우스 오른쪽 후 new Image Assets을 누릅니다. 다운받은 Icon Png File을 서택합니다.

 

splashscreen을 Image Gorilla를 통해 다운받습니다.

App/res/drawable-land.../splash.png를 변경해 줍니다.

 

Android Deploy

안드로이드 스튜디오 에서 

Build->Generate Signed Bundle/APK -> next

key store path : 나의 저장소

password : 마음대로

 

next를 하다보면 buildType이 나옵니다. 반드시 release로 해야합니다.

 

iOS Deploy - 유료계정이 없네요 ㅠㅠ

 

Web - progressive web app Deploy

www폴더가 배포할 수 있는 폴더입니다.

 

하지만 PWA로 진행해보겠습니다.

아래 2개를 명령어를 실행합니다.

 

ng add @angular/pwa

ng build --prod

 

filrebase를 이용하는 경우에 다음과 같이 실행합니다.

fireabse init

?  What do you want to use as your public directory? www
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? File www/index.html already exists. Overwrite? 마음것 하세용~

 

www/ngsw-config.json에 있느 설정값으로 deploy됩니다.

 

다음 명령어를 실행합니다.

firebase deploy