Vue Twitch extension plugin

Description

Vue Twitch extension plugin is Vue.js plugin made to help you to develop Twitch extension.

This package is published on Github packages. Before installing it you need to add a .npmrc file in your project that contain:

registry=https://npm.pkg.github.com/utip

Install with

npm install @utip/vue-twitch-extension-plugin

In your HTML template import the twitch-ext module:

<script src="https://extension-files.twitch.tv/helper/v1/twitch-ext.min.js"></script>

Then install the plugin

import Vue from 'vue'
import TwitchExtensionPlugin from '@utip/vue-twitch-extension-plugin';

Vue.use(TwitchExtensionPlugin)

The twitch extension object describe in Twitch documentation references is available in all your component with this.$twitch.ext

Twitch help user to manage the configuration of the extension with their Configuration service

The configuration is available in the this.$twitch.configuration object:

{
    broadcaster: {},
    developer: {},
    global: {},
}

The configuration is reactive and you can add a watch on it to keep it updated in your component:

watch: {
    '$twitch.configuration': function() {
      this.key = this.$twitch.configuration.broadcaster.key
    }
}

For each segment the configuration is stored as JS object. You can update a configuration on a segment with:

this.$twitch.publishConfig({key: 'value'}, segment = 'broadcaster', version = '1.0')

The Twitch context (theme, language, current game...) is available inside your component with:

this.$twitch.context

uTip's repositories are open projects, and community contributions are essential for keeping them great.