remark-reactでマークダウンファイルをレンダリングしたい

前提・実現したいこと

Next.jsとContentfulでJamstackブログをつくっています。
ContentfulでPublishしたMarkdownファイルを取得し、remark-reactでレンダリングしようとしたところ、開発環境では問題なくレンダリングできるのですが、Bulid時に以下のエラーメッセージが発生しました。

remark-react

発生している問題・エラーメッセージ

Property 'result' does not exist on type 'VFile'.
//ソースコード"const renderedContent = processor.processSync(rawMarkdownText).result"箇所

該当のソースコード

TypeScript
1import unified from 'unified'
2import parse from 'remark-parse'
3import remark2react from 'remark-react'
4
5const Post = (post) => {
6  // Fetch and rendor the markdown content
7  const rawMarkdownText = post.markdown //Markdown File
8  const processor = unified().use(parse).use(remark2react)
9  const renderedContent = processor.processSync(rawMarkdownText).result
10
11  return (
12    <>
13      <h1>{post.title}</h1>
14      <p>This is the blog post content.</p>
15      <div>${renderedContent}</div>
16    </>
17  )
18}

試したこと

下記のprocessパターン

TypeScript
1processor.processSync(rawMarkdownText).result
2
3processor.processSync(rawMarkdownText).contents
4
5processor.process(rawMarkdownText).result
6
7processor.process(rawMarkdownText).contents

補足情報（FW/ツールのバージョンなど）

package.json

    "@contentful/rich-text-react-renderer": "^13.4.0",
    "@contentful/rich-text-types": "^14.1.0",
    "contentful": "^7.14.4",
    "next": "^9.4.1",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "remark": "^12.0.0",
    "remark-parse": "^8.0.2",
    "remark-react": "^7.0.1",
    "unified": "^9.0.0"
  },
  "devDependencies": {
    "@types/node": "^13.13.6",
    "@types/react": "^16.9.35",
    "@typescript-eslint/eslint-plugin": "^2.33.0",
    "@typescript-eslint/parser": "^2.33.0",
    "eslint": "^6.8.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-prettier": "^3.1.3",
    "prettier": "^2.0.5",
    "typescript": "^3.9.2"
  }```