muntasirsyed / react-moengage

React wrapper around the MoEngage Web SDK.

React MoEngage

A convenient wrapper around the MoEngage Web SDK for React.

Install

npm install --save react-moengage

Usage

import MoEngage from "react-moengage"

MoEngage.init("MOENGAGE_APP_ID", {
    debugLogs: 0,
    swPath: "/customSw.js",
})

MoEngage.trackEvent("PurchaseMade", { ...data })

Methods

All methods are camel-cased versions of those specified in the MoEngage SDK documentation.

MoEngage.trackEvent("PurchaseMade", { value: 0.5 })

MoEngage.addFirstName("Dominick")
MoEngage.addLastName("Cobb")
MoEngage.addEmail("[email protected]")
MoEngage.addMobile("[phone]")

Moengage.addUserAttribute("replenishment_date", new Date(2021, 4, 30))

The moe object is also accessible directly if need-be:

const moe = MoEngage.moe

moe.onsite.registerCallback(...args)
moe.onsite.getData(...args)

Environment

By default debugLogs is set to 1 (test mode).

As in the MoEngage SDK documentation, set debugLogs to 0 in order to push data to your LIVE environment. Set it to 1 in order to push data to your TEST environment & enable logging to the console.

Server-Side Rendering

Please note in order to initialise this library, the MoEngage SDK relies on the window object and therefore will only work in the browser. If server-side rendering, it is recommended to call init() in somewhere like componentDidMount() or useEffect(..., []).

import MoEngage from "react-moengage"

class MyComponent extends React.Component {
    componentDidMount() {
        const options = { ... }
        MoEngage.init("MOENGAGE_APP_ID", options)
    }
}

react-moengage's Issues

Could not find a declaration file for module

Could not find a declaration file for module 'react-moengage'. '/Users/Projects/React-Web/node_modules/react-moengage/dist/react-moengage.js' implicitly has an 'any' type.
Try npm i --save-dev @types/react-moengage if it exists or add a new declaration (.d.ts) file containing declare module 'react-moengage';ts(7016)