How do I install Crisp Live Chat on Nuxt.js

Are you using Nuxt.js to create your new web application? With this article, you can install a chat widget to any NuxtJS app in less than 2 minutes.

1. Create an account on Crisp and head over to app.crisp.chat
2. Navigate to Settings → Workspace Settings → Setup & Integrations
3. Copy the script from "Chatbox setup instructions"

7. Copy the JavaScript code to retrieve your `CRISP_WEBSITE_ID`.

8. Inside your `plugins` folder, create a file `crisp.js` and paste this code below. Replace the `CRISP_WEBSITE_ID` with yours.

export default () => {  window.$crisp = [];  window.CRISP_WEBSITE_ID = "MY-UNIQUE-ID";  (function() {    var d = document;    var s = d.createElement("script");    s.src = "https://client.crisp.chat/l.js";    s.async = 1;    d.getElementsByTagName("head")[0].appendChild(s);  })();};

Then, we tell Nuxt.js to import it in our main application. Open `nuxt.config.js`:

module.exports = {  plugins: [{ src: "~plugins/crisp.js", mode: "client" }]};

For your information, setting `mode` to `client` tells the server that this plugin should only be run on the browser. Rendering this plugin server-side would trigger an error as it is making use of the `window` object.

If you refresh the page, you should now see your brand new chat widget appearing on your website.

Bijgewerkt op: 12/02/2026