cordova-deviceready-manager

Installation

# With npm
npm i cordova-deviceready-manager


# With yarn
yarn add cordova-deviceready-manager

Usage

Initialization

You first need to initialize the package. This should happen early on as your app is initializing everything.

import {initDeviceReady} from "cordova-deviceready-manager";

initDeviceReady({
    onDeviceReady: () => /* ... Do something when its ready */
    maxWaitTime: 20 * 1000
});

You don't have to provide any options to this function at all if you don't want to:

initDeviceReady();

The "onDeviceReady" function in initDeviceReady provides an opportunity to do some additional or special setup as soon as the deviceready function fires. However, this usually isn't necessary and you can just use the onPluginReady function.

onPluginReady

onPluginReady allows you to independently bind as many function callbacks to as many plugins as you need. This allows you to safely put plugin functionality anywhere in your application without having to worry about initialization, or even if cordova is available in that context.

The following is an example of how you could use this package with cordova-plugin-statusbar.

import {onPluginReady} from "cordova-deviceready-manager";

onPluginReady("StatusBar", StatusBar => {
    // This code will not execute unless and until the plugin is available
    StatusBar.show();
});

Spelling of the first argument, the name of the plugin, is important. Make sure you match the way the plugin exports. You can name the argument in your callback function whatever you'd like though.

If you want a promise, you can use the promise form instead:

onPluginReadyPromise("StatusBar")
    .then(StatusBar => {
        StatusBar.show();
    });

You can also provide a mock version of the plugin for testing outside of the target device

onPluginReady("StatusBar", { fallback: MockStatusBar }, StatusBar => {/* ... */})

Building with Webpack

To make it easier to develop robust, clean plugins, this package comes with a CLI tool with basic Babel/webpack functionality.

npx pluginbuilder build index.js

This will produce a file called plugin.js that should be more compatible with older browsers and consolidates your plugin javascript into a single file; allowing you to divide your file up into cleaner parts and even use npm dependencies.