Prism.js + React highlights immediately after import

Question

When I import Prism.js in a React app, Prism.js automatically and immediately hightlights all code blocks.

I want to highlight the code blocks manually.

This is my React app codes:

import React from "react";
import Prism from "prismjs";
import "prismjs/themes/prism-tomorrow.css";

const code = `const App = props => {
  return (
    <div>
      <h1> React App </h1>
      <div>Awesome code</div>
    </div>
  );
};
`;

export default function App() {
  return (
    <pre>
      <code className="language-javascript">{code}</code>
    </pre>
  );
}

See the live example at Codesandbox

How can I highlight the code block manually?