1. Home
  2. Integrazioni
  3. Vue e Nuxt

Chatbot AI per Vue e Nuxt: come installarlo

Con Vue basta il file HTML di partenza; con Nuxt si usa la configurazione.

Lo trovi già pronto nel pannello, con la tua chiave, e lo copi con un clic. Ha questa forma:

<script src="https://app.interlyo.com/widget/chatbot.js" data-api-key="la-tua-chiave" defer></script>

1Nuxt 3

  1. Apri nuxt.config.ts.
  2. Aggiungi lo script nella sezione head.
export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: 'https://app.interlyo.com/widget/chatbot.js',
          'data-api-key': 'la-tua-chiave',
          defer: true,
        },
      ],
    },
  },
});

Funziona anche con useHead o useScript. Scrivi l’attributo come 'data-api-key', con i trattini.

2Vue 3 con Vite

  1. Apri index.html.
  2. Incolla il codice dopo il contenitore dell’app.
<body>
  <div id="app"></div>
  <script src="https://app.interlyo.com/widget/chatbot.js" data-api-key="la-tua-chiave" defer></script>
</body>

Carica chatbot.js dal nostro indirizzo, come nel codice qui sopra. Non scaricarlo nel progetto, non rinominarlo e non includerlo nel bundle del sito: il widget non troverebbe più la chiave e il nostro server.

Pronto a installarlo?

Ti iscrivi gratis e il pannello ti dà il codice e le istruzioni per la tua piattaforma.