vue-xml-editor v0.0.8

Package installed

"dependencies": {
    "highlight.js": "^11.0.1",
    "vue-xml-editor": "^0.0.5"
  }

OR

npm highlight.js vue-xml-editor --save

Highlight.js xml editor plugin for Vue.js

Then simply register the plugin with Vue:

import hljs from 'highlight.js/lib/core';
import javascript from 'highlight.js/lib/languages/javascript';
import xmlEditorPlugin from "vue-xml-editor";

hljs.registerLanguage('javascript', javascript);

const app = createApp(App)
app.use(xmlEditorPlugin)
app.mount('#app')

Using component locally

<template>
  <div>test</div>
  <xmlEditor
    class=""
    language="xml"
    :code="inputContent"
    @update="updateNow"
  ></xmlEditor>
</template>

<script lang="ts">
import axios from "axios";
import { defineComponent } from "vue";
export default defineComponent({
  name: "app",
  data() {
    return {
      inputContent: "",
      test: "jlj",
    };
  },
  methods: {
    updateNow(val) {
      console.log(val, "val");
    },
  },
  async mounted() {
  },
});
</script>