How to add Disqus Comments to NuxtJS project

Last updated at April 19, 2021


Install vue-disqus package from npm

npm install vue-disqus --save

Create plugin file(ex. disqus.js) in /plugins folder

You can get your shortname after register your webiste in Disqus Admin.

import Vue from 'vue'
import VueDisqus from 'vue-disqus'

Vue.use(VueDisqus, {
  shortname: 'your-disqus-shortname',

Register plugin file in nuxt.config.js

export default {
  // ...
  plugins: [

Add Disqus vue component to your vue file

  <div class="comments">
    <Disqus />

Add DisqusCount vue component to your vue file to display comments count

See documentation to get detail information.

    <DisqusCount tag="a" :url="`/articles/${article.slug}`" :identifier="`/articles/${article.slug}`" />