joplin-notes/joplin notion extension/Web Development/Javascript/capacitor.md
2026-11-04 00:33:23 +05:30

1 KiB

capacitor

https://capacitorjs.com/docs/getting-started and https://github.com/fruzelee/capacitor-web2app/tree/main

in terminal create project

npm init @capacitor/app@latest it will be interactive so select app name, name of directory and app id (com.example.appname)

npm i this will download capacitor/core and capacitor/cli

then 2nd section

npx cap init

npm i @capacitor/android

then

npm run build

npx cap add android

instead of npm init @capacitor/app@latest use vite to simply create a vanilla one npm create vite@latest and then install npm install @capacitor/cli @capacitor/core

then from 2nd section

status bar fix https://capacitorjs.com/docs/apis/status-bar

install this and then in configs add it and in js file

import { StatusBar, Style } from '@capacitor/status-bar';

 setTimeout(async () => {
        try {
          await StatusBar.setStyle({ style: Style.Dark }); // Forces white icons
        } catch (e) {
          console.error("Status bar styling failed", e);
        }
      }, 200);