How to render scripts on nextJS _doucment based on env variables?

Viewed 27

I have a nextjs _document file where i need to add scripts based on env variables... ( dev, stage, production ) How can i console log on _document and debug as well as load script based on env variables

/* eslint-disable react/display-name */
import Document, { Head, Html, Main, NextScript } from 'next/document';
import { ReactElement } from 'react';
import { ServerStyleSheet } from 'styled-components';

export default class CustomDocument extends Document<{
  styleTags: ReactElement[];
}> {
  static getInitialProps({ renderPage }) {
    const sheet = new ServerStyleSheet();

    console.log('process env', process.env);

    const page = renderPage(App => props => sheet.collectStyles(<App {...props} />));

    const styleTags = sheet.getStyleElement();

    return { ...page, styleTags };
  }

  render() {
    console.log('Propsssss', this.props);
    return (
      <Html>
        <Head>
          {this.props.styleTags}
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    );
  }
}

0 Answers
Related