Waymark Plugin — Installation
The Waymark Plugin can be installed either as an NPM package or via a <script>
tag in your HTML.
NPM Package
Tip
This is recommended for most use cases.
npm install --save @waymark/waymark-sdk
The package includes both CommonJS and ESModule builds, as well as TypeScript typings.
After installing the Waymark Plugin SDK, you may import the Waymark
class and initialize it like so:
import Waymark from '@waymark/waymark-sdk';
const waymark = new Waymark('partnerID', options);
See the API reference page for more details on how to initialize and use the Waymark class.
HTML script tag
You may use any trusted npm CDN such as https://www.unpkg.com or https://www.jsdelivr.com to
load the Waymark SDK via a <script>
tag at runtime.
<script src="https://cdn.jsdelivr.net/npm/@waymark/waymark-sdk@3.x.x" async></script>
The async
attribute is optional, but recommended as it will allow the script to load asynchronously so that it does not block the page's initial render.
When the script is loaded, the Waymark class will be made available globally on window.Waymark
.
To be notified when window.Waymark
is loaded and available for use, you may set up an event listener in one of two ways:
-
Set a function on
window.onWaymarkInit
. This function will be called when the SDK has loaded and is available for use.window.onWaymarkInit = () => { const waymark = new window.Waymark(partnerID, options); };
-
The SDK will also emit a custom
waymark:init
event on the document which can be subscribed to.document.addEventListener('waymark:init', () => { const waymark = new window.Waymark(partnerID, options); });
WARNING
If the browser loads your script after the Waymark Plugin script, it is possible that you could miss the
waymark:init
event.
It is recommended that you check if window.Waymark
is already available to perform your setup instead of just listening
for the waymark:init
event.
const onWaymarkInit = () => {
const waymark = new window.Waymark(partnerID, options);
};
if (window.Waymark) {
// If the Waymark SDK is already loaded, run the setup code immediately
onWaymarkInit();
} else {
document.addEventListener('waymark:init', onWaymarkInit);
}