SteemConnect Plugin for Vue.js

Repository

https://github.com/mktcode/vue-steemconnect

I tried now several times to include SteemConnect in a Vue.js app and I think there's need for a plugin. What I did is really nothing special but maybe it can be a start for others to work on this and improve it. I never wrote a plugin for Vue.js, so this is more an experiment for me. But it works.

The main purpose for now is simply to have sc2-sdk installed with the plugin and making it globally available in one step.

It takes the options to initialize the API and exposes it globally and for components:

Vue.prototype.$steemconnect = api;
// setting the api directly as the value does not work,
// methods are removed (why? serialization?)
Vue.SteemConnect = function () {
  return api;
};

Maybe you can answer the question in this comment... you see, I'm a novice. Why does Vue.SteemConnect = api; not work? The methods, like getLoginURL(), are not available then.

From the Readme:

npm i --save vue-steemconnect

Use it anywhere you want like this:

import Vue from 'vue'
import VueSteemConnect from 'vue-steemconnect'

Vue.use(VueSteemConnect, {
  app: 'appname',
  redirectUrl: 'http://localhost:3000'
  scope: ['vote', 'comment']
})

Vue.SteemConnect.getLoginURL()
Vue.SteemConnect.vote(...)
Vue.SteemConnect.comment(...)

In components it's available like this:

this.$steemconnect.getLoginURL()
this.$steemconnect.vote(...)
this.$steemconnect.comment(...)
...

I like Nuxt.js, so here's how to enable the plugin there:

Nuxt.js

Create a ~/plugins/vue-steemconnect.js:

import Vue from 'vue'
import VueSteemConnect from 'vue-steemconnect'

Vue.use(VueSteemConnect, {
  app: 'mkt.test',
  callbackURL: 'http://localhost:3000/auth',
  scope: ['vote', 'comment']
})

And enable it in ~/nuxt.config.js:

plugins: [
  '~/plugins/vue-steemconnect'
],

Again, this is my first try to create a Vue.js plugin and it's really nothing more than a simple wrapper, so to speak. I don't even know if it's really useful like this but I just think it would be nice to have something like this, for all Steem developers that like Vue.js. Everyone is kindly invited to make this a really useful plugin. Because since now you can instead just install sc2-sdk yourself and import it anywhere you want. Maybe some of you have ideas for actually useful features.

For example:

• If Vuex store exists, automaticall add a steemconnect.user property
• Wrap methods, to automatically use logged-in user in methods that require a username parameter (vote, reblog, follow, etc.)

I would be happy to get some feedback, from more experienced Vue.js developers. Feel free to comment what you think.