https://github.com/gaia-charge/svelte-ackee

📊️ Ackee analytics component for Svelte
https://github.com/gaia-charge/svelte-ackee

ackee analytics hacktoberfest svelte sveltejs

Last synced: 26 days ago
JSON representation

📊️ Ackee analytics component for Svelte

• Host: GitHub
• URL: https://github.com/gaia-charge/svelte-ackee
• Owner: gaia-charge
• License: mit
• Created: 2020-12-09T10:17:33.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2023-01-11T14:09:53.000Z (almost 2 years ago)
• Last Synced: 2024-10-04T20:06:04.795Z (about 1 month ago)
• Topics: ackee, analytics, hacktoberfest, svelte, sveltejs
• Language: JavaScript
• Homepage:
• Size: 1.69 MB
• Stars: 5
• Watchers: 4
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


    

    +

    



# Svelte module for Ackee

[Ackee](https://ackee.electerious.com/) is a self-hosted analytics tool for those who care about privacy and this module makes it easy to integrate with Svelte/Sapper.

## Installation

```

$ npm install --save svelte-ackee

```

## Usage

### With Sapper

Edit the `routes/_layout.svelte` and add following script:

```js

import { afterUpdate, beforeUpdate } from "svelte";

import { useAckeeSapper } from "svelte-ackee";

export let segment;

const ackeeTracker = useAckeeSapper(

  beforeUpdate,

  afterUpdate,

  {

    server: "https://example.com", // Set to your Ackee instance

    domainId: "hd11f820-68a1-11e6-8047-79c0c2d9bce0", // Set to your domain ID

  },

  {

    ignoreLocalhost: false,

  }

);

```

See the demo in [`demos/sapper`](demos/sapper) directory.

### With Routify

Edit the `App.svelte` and add following:

```js

import { useAckeeSvelte } from "svelte-ackee";

import { afterPageLoad } from "@roxi/routify";

const ackeeTracker = useAckeeSvelte(

  $afterPageLoad,

  {

    server: "https://example.com",

    domainId: "hd11f820-68a1-11e6-8047-79c0c2d9bce0",

  },

  {

    ignoreLocalhost: false,

  }

);

```

See the demo in [`demos/routify`](demos/routify) directory.

### Accessing underlying `ackee-tracker`

Both `useAckeeSapper` and `useAckeeSvelte` return an [`ackee-tracker` instance](https://github.com/electerious/ackee-tracker) so you can call it manually as well:

```js

ackeeTracker.action("513a082c-2cd5-4939-b417-72da2fe1761d", {

  key: "Checkout",

  value: 9.99,

});

```