Use with NextJS

[daraclare]

Is it possible to use this with Zeit's NextJS? Would love to add it to our app of at all possible, any advice?

[mliq]

Put below code at top of any file (not inside any actual react function) that is loaded on all your pages (such as custom or , see https://github.com/zeit/next.js#populating-head).

you may need to install react-dom in your package.json also.

/**
 * Determines if we are running on server or in client.
 * @return {boolean} true if running on server
 */
function getIsServerRendered() {
    return typeof window === 'undefined';
}

/**
 * Accessibility tool - outputs to devtools console on dev only and client-side only.
 * @see https://github.com/dequelabs/react-axe
 */
if (process.env.NODE_ENV !== 'production' && !getIsServerRendered()) {
    const ReactDOM = require('react-dom');
    const axe = require('react-axe');
    axe(React, ReactDOM, 1000);
}

[daraclare]

Finally got a few minutes to implement this, thank you very much, really useful 👍

[dhsrocha]

Finally got a few minutes to implement this, thank you very much, really useful 👍

Have you put this code snippet in a file like next.config.js or pages/_document.js?

[dhsrocha]

Put below code at top of any file (not inside any actual react function) that is loaded on all your pages (such as custom or , see https://github.com/zeit/next.js#populating-head).

you may need to install react-dom in your package.json also.

/**
 * Determines if we are running on server or in client.
 * @return {boolean} true if running on server
 */
function getIsServerRendered() {
    return typeof window === 'undefined';
}

/**
 * Accessibility tool - outputs to devtools console on dev only and client-side only.
 * @see https://github.com/dequelabs/react-axe
 */
if (process.env.NODE_ENV !== 'production' && !getIsServerRendered()) {
    const ReactDOM = require('react-dom');
    const axe = require('react-axe');
    axe(React, ReactDOM, 1000);
}

Is that eligible for going into official documentation under a topic like "Integration"?

[daraclare]

I used it in our pages/_app.tsx file, works well so far.