Fix highlight.js does not work with page transition

I was using highlight.js to add color to the code, but when I added page transition, it stopped working.

1. page transition

const MyApp = () => {
  const router = useRouter();

  return (
    <GlobalPageTransition>
      <Component {...pageProps} key={router.route} />
    </GlobalPageTransition>
  );
};

In this way, <GlobalPageTransition> gave animation at page transition.

2. highlight

const MyApp = () => {
  useHighlight();

  // ...
};

I use these hooks to automatically launch highlight.js.
WIthin this hooks, other than unmounting, is the process of giving highlight.

useEffect(() => {
    let mounted = true;
    if (mounted) {
      // highlight processing
    }
    return () => {
      mounted = false;
    };
  });

However, if I add to this process, the initial load does not work properly.

3. Solutions

It was highlighted by adding it inside the [title].tsx component instead of _app.tsx.

const Post = () => {
  useHighlight();
  // ...
});