使用mermaid.render出现Syntax error(v11.4.0)且渲染尺寸受限求助

使用mermaid.render时遇到渲染错误，同时渲染出的图表尺寸被限制。以下是复现问题的示例代码：

index.html #

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="module" src="main.js"></script>
    
    <pre id="my-diagram" class="mermaid"></pre>
</body>
</html>

main.js #

import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';

mermaid.initialize({ startOnLoad: false });

var target = document.getElementById('my-diagram')
const graphDefinition = 'graph TB\na-->b';

mermaid.render('my-diagram', graphDefinition, target);

实际问题出现在我的Angular项目中，项目里只能通过元素的innerHTML来渲染图表。

内容的提问来源于stack exchange，提问作者romroms