> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://staging.chrisp.chat/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 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"

![](https://storage.crisp.chat/users/helpdesk/website/-/f/7/a/c/f7ac522cbb043800/99b1764c-bcd4-487b-b79c-a21195_g10q3f.png)

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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/8/d/0/d8d085d6b0738800/0beac6c0-86c4-4d47-878b-1bcd6a_v2eyz1.png)

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);
  })();
};
```

||| Make sure to replace `CRISP_WEBSITE_ID` with yours. Otherwise, this will not work!

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.**