or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

configuration-modes.mdcore-highlighting.mddom-integration.mdindex.mdlanguage-management.mdmodes-utilities.mdplugin-system.mdvue-integration.md
tile.json

vue-integration.mddocs/

Vue.js Integration

Vue.js plugin for seamless integration with Vue components and applications. The plugin provides a standard Vue plugin interface that can be easily installed in any Vue application.

Capabilities

Vue Plugin

Creates a Vue.js plugin for highlighting code within Vue applications.

/**
 * Creates a Vue.js plugin for highlight.js integration
 * @returns VuePlugin instance with install method
 */
function vuePlugin(): VuePlugin;

interface VuePlugin {
  /** Standard Vue plugin install method */
  install: (vue: any) => void;
}

Usage Examples:

import hljs from 'highlight.js';
import { createApp } from 'vue';

// Vue 3 installation
const app = createApp(App);
app.use(hljs.vuePlugin());

// Vue 2 installation (legacy)
import Vue from 'vue';
Vue.use(hljs.vuePlugin());

In Vue Components:

<template>
  <div>
    <pre><code class="javascript">{{ code }}</code></pre>
  </div>
</template>

<script>
export default {
  data() {
    return {
      code: 'console.log("Hello, Vue!");'
    };
  },
  mounted() {
    // Plugin automatically makes hljs available
    this.$hljs.highlightAll();
  }
};
</script>