featured image for
blog

Vue plugin details

Vue plugin development

Vue is a great replacement for Angular and its complexity, developed by Even You, an ex Googler.

It is not so difficult and is pleasant to work with.

But its compiler errors were a pain to deal with.

And I found it to be quite forgiving of all the frameworks.

It is also richly popular due to its low learning curve and high utility.

It is useful either or SPA or simply plug it as a standalone project inside normal web pages.

Plugin architecture

Just like react ProgressUp.vue is the one with the template,style and the typescript.

How it works?

The vue plugin is similar to other plugins in the sense that the code sits along with template to deliver functionality.

Reactivity and HTML interpolation occurs using the standard vue methods and v-for looping constructs.

How do you use it?

The stackblitz link has the instructions and help needed.

In short, just installing using npm or yarn like this will get you started.

	$ yarn install progress-up-vue

or

	$ npm install progress-up-vue

Then just put this inside the HTML source the tags needed and you are done.

	<progress-up></progress-up>

Challenges

The only challenge I faced in the vue work was the unhelpful debug messages.

Vue.js is a really nice easy to use framework and is nice for rapid prototyping and quick projects.

I used vite and the packaging tools with it.

The documentation on vue.js is bit scarce but the code is easy to follow and the plugins available on npm and github are impressive.

Back to blog