Switching to Capacitor

After switching to Capacitor and following instructions about removing the Cordova Plugin SplashScreen as mentioned on https://capacitor.ionicframework.com/docs/getting-started/with-ionic/ I get this warning in the console:

common.js:295 Native: tried calling SplashScreen.hide, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator

when running npx cap serve
is it possible to remove this or is it a bug in Ionic4 ?

You can also uninstall @ionic-native/splashscreen and remove the code - then this message should be gone. You can manage the Splashscreen with Capacitor: https://capacitor.ionicframework.com/docs/apis/splash-screen

You pointed me in the right direction, as it is not enough just to remove the plugin as stated on the Capacitor-website, I also need to remove the usage of the plugin from and app.component.ts, where I had these statements

this.platform.ready().then(() => {
  this.statusBar.styleDefault();
  this.splashScreen.hide();
});

I have now replaced that with:

import {
Plugins,
StatusBarStyle,
} from ‘@capacitor/core’;

const { StatusBar } = Plugins;
const { SplashScreen } = Plugins;

and

this.platform.ready().then(() => {
  StatusBar.setStyle({
    style: StatusBarStyle.Light
  });
  SplashScreen.hide();
});

in app.component.ts

But I did not find a way to uninstall @ionic-native/splashscreen as it is not anywhere in my configuration

You should be able to just run npm uninstall @ionic-native/splashscreen, and you can also import both the StatusBar and SplashScreen in one line:

const { StatusBar, SplashScreen } = Plugins;

Make sure to run the Capacitor sync or update commands whenever you change plugins too :slight_smile:

2 Likes

Looking in config.xml there are a loot of settings for SplashScreen

<preference name=“SplashMaintainAspectRatio” value=“true” />
<preference name=“FadeSplashScreenDuration” value=“300” />
<preference name=“SplashShowOnlyFirstTime” value=“false” />
<preference name=“SplashScreen” value=“screen” />
<preference name=“SplashScreenSpinnerColor” value=“white” />
<preference name=“ShowSplashScreenSpinner” value=“true” />
<preference name=“FadeSplashScreen” value=“true” />
<preference name=“AutoHideSplashScreen” value=“false” />
<preference name=“SplashScreenDelay” value=“60000” />
<preference name=“orientation” value=“portrait” />
<preference name=“SplashReloadOnOrientationChange” value=“true” />

Should they all just be removed, when switching to Capacitor?

Those are not used by Capacitor, so yes.
You might want to see if Capacitor’s SplashScreen recreates those all though.

Capacitor can be configured in capacitor.config.json, so I will try deleting and hope for the best :slight_smile:

1 Like