capacitor

Ionic 5 – Splashscreen

Table of Contents

Intro

How to add spashscreen to your ionic 5 app with capacitor. The fast way!

Sources

Splashscreen with Capacitor

				
					npm install -g cordova-res
				
			
resources/
├── icon.png
└── splash.png
  • resources/icon.(png|jpg) must be at least 1024×1024px
  • resources/splash.(png|jpg) must be at least 2732×2732px
				
					$ cordova-res ios --skip-config --copy
$ cordova-res android --skip-config --copy

				
			

Build you apps, done!

Ionic 5 – Develop for Android

Table of Contents

Source

Installing & Run

Deploy for Android

				
					ionic build				// build if never built
ionic cap add android	// add android support if not added while start
ionic cap copy			// Builds and Copy Web Assets to Capacitor native platform
ionic cap sync			// update Project Data
ionic cap open android  // opens Project in Android Studio
				
			

Debug

				
					adb devices             //checks android device connection
				
			

Livereload

				
					ionic capacitor copy android
ionic capacitor run android -l --external
				
			

Thats it so far have fun

Ionic 5 – Develop for Electron

Table of Contents

How to add SQLite Database in to your Ionic Project fast and easy without any issues with some short snippets that are very easy to understand!

Source

Installing & Run

				
					npm i @capacitor-community/electron
npx cap add @capacitor-community/electron
npx cap open @capacitor-community/electron
				
			

Thats it so far have fun

Ionic 5 – capacitor SQLite Database

Table of Contents

How to add SQLite Database in to your Ionic Project fast and easy without any issues with some short snippets that are very easy to understand!

Source

Installing & Run

				
					//main.ts
import { defineCustomElements as jeepSqlite} from 'jeep-sqlite/loader';


jeepSqlite(window);
				
			

If you need to install some other platform

				
					npm install @capacitor/android
npm install @capacitor/ios
npm i @capacitor-community/electron
				
			

Install SQLite for Capacitor.

				
					npm install  @capacitor-community/sqlite
npm run build
npx cap add android
npx cap add ios
npx cap add @capacitor-community/electron

				
			

If you want sqlite with web apps

				
					@capacitor-community/sqlite@web

				
			

Code updating

				
					npx cap sync
npx cap sync @capacitor-community/electron
				
			

For Web App

				
					copy manually the file sql-wasm.wasm from nodes_modules/sql.js/dist/sql-wasm.wasm to the src/assets folder of YOUR_APP
				
			

Electron App

				
					cd electron
npm install --save sqlite3
npm install --save-dev @types/sqlite3
npm run build
				
			

Build App

				
					npm run build
npx cap copy
npx cap copy web
npx cap copy @capacitor-community/electron
				
			
				
					npx cap serve
npx cap open ios
npx cap open android
npx cap open @capacitor-community/electron
				
			

Thats it so far have fun