Monday, May 11, 2020

Vue - vue-custom-element

Vue-custom-element seems like the best way to integrate vue into an existing application that uses server side templates.

This approach allows you to use vue components (built with the build pipeline) in your existing html without making your entire application a SPA.

Initially I started following this guide: https://robinverton.de/blog/2018/06/22/django-vue.js-integration-as-a-widget/

Vue-custom-element turned that code into 3 lines and allowed using components like normal (without the data attributes).

This approach seems much better than: https://vsupalov.com/vue-js-in-django-template/ Which doesn't allow for using a build pipeline for babel, linting, testing, single page components, live reload, modules with import/require, etc.

Targeting your builds for web components might do the same thing: https://cli.vuejs.org/guide/build-targets.html#web-component It says it's not compatible with IE11, but that might not be a big deal in most situations.

2 comments:

  1. Hi, I was on degreeforum and saw you had a link to a study guide/notes for the TESU CMP-354 TECEP exam. Do you still have this?

    ReplyDelete
  2. Hi, I was on degreeforum and saw you had a link to a study guide/notes for the TESU CMP-354 TECEP exam. Do you still have this?

    ReplyDelete