I know this is a duplicate, but I couldn't solve my problem with those answers. so here is my code:
//_document.tsx
import Document, { Html, Head, Main, NextScript } from "next/document";
export default class MyDocument extends Document {
render() {
return (
<Html>
<Head />
<body dir="rtl">
<Main />
<NextScript />
</body>
</Html>
);
}
}
//_app.tsx
import "../styles/globals.scss";
import Head from "next/head";
import type { AppProps } from "next/app";
function MyApp({ Component, pageProps }: AppProps) {
return (
<>
<Head>
<title>Bitbarg</title>
<meta name="description" content="Descriptions" />
<link rel="icon" href="/favicon.ico" />
<body dir="rtl" />
</Head>
<Component {...pageProps} />
</>
);
}
export default MyApp;
I'm still getting this error.
I tried taking all _app.tsx Head tag in _document.tsx, this removed the error but I'm getting new error as:
Titles should be defined at the page-level using next/head.
I tried only putting code bellow in _app.tsx, but it gives me the next-head-count error again.
<Head>
<title>Bitbarg</title>
</Head>