How to add FastClick to Next.JS?

Question

When I try to modify pages/_document.js to add the FastClick event registration (see below) it complains that ReferenceError: document is not defined . I guess it's because it's executed on the server and the document is not defined there. Any way to resolve it?

if ('addEventListener' in document) {
  document.addEventListener('DOMContentLoaded', function() {
    FastClick.attach(document.body)
  }, false)
}

Answer 1

you can use process.browser to make sure your code is being executed in the front end only.

if (process.browser) {
  document.addEventListener('DOMContentLoaded', function() {
    FastClick.attach(document.body)
  }, false)
}

Answer 2

pages/_document.js only rendered on server according to next.js documentation .

I suggest to use that code in pages/_app.js which will be shared between all components.