When used preview model via React.lazy() cannot found MDEditor.Markdown
const MDEditor = React.lazy(() => import('@uiw/react-md-editor')); ...... <Suspense fallback="..."> <MDEditor.**Markdown** source="Hello Markdown!" /> </Suspense>
Compilation Error in MDEditor.Markdown
declare type Editor = React.FC<PropsWithRef<MDEditorProps>> & { Markdown: typeof MarkdownPreview; };
`//import MDEditor from '@uiw/react-md-editor'; const MarkdownPreview = React.lazy(() => import("@uiw/react-markdown-preview"));
return (<Suspense fallback="..."><MarkdownPreview source={source} className={styles.mdEditor} /></Suspense>)`
@pccai Example: https://codesandbox.io/embed/markdown-editor-for-react-https-github-com-uiwjs-react-md-editor-issues-508-bb9r6w?fontsize=14&hidenavigation=1&theme=dark
import React, { Suspense } from "react";
import ReactDOM from "react-dom";
const MarkdownPreview = React.lazy(() => import("@uiw/react-markdown-preview"));
const MarkdownEditPreview = React.lazy(async () => {
const mdx = await import("@uiw/react-md-editor");
console.log("mdx:", mdx, mdx.default.Markdown);
return {
default: mdx.default.Markdown
};
});
function App() {
return (
<div className="container">
<Suspense fallback={<div>loading...</div>}>
<MarkdownPreview source="## Hello World" />
</Suspense>
<Suspense fallback={<div>loading...</div>}>
<MarkdownEditPreview source="## Hello World" />
</Suspense>
</div>
);
}
ReactDOM.render(<App />, document.getElementById("container"));