[Bug]: 소스 코드가 보이지 않습니다

[simyat]

Describe the bug

글을 클릭하면 소스 코드가 보이지 않을 때가 있습니다. 새로고침 해야 출력 되는데 해결 부탁 드려요 ㅠㅠ

• 새로 고침 전
• 새로 고침 후

To reproduce

1. Go to ...
2. Click on ...
3. Scroll down to ..
4. See error

Browser

Google Chrome v109, Windows 10

Validations

• [X] Follow our Code of Conduct
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[IceCream0910]

이는 prismjs 관련 이슈로 react-notion-x repo의 issue에서도 보고되고 있는 것으로 보입니다. 저는 다음과 같은 방법으로 수정 후 현재까지 동일 이슈가 재현되지 않아 공유드립니다.

src/routes/Detail/components/NotionRenderer/index.tsx에서 다음 코드를 삭제하고

const Code = dynamic(() =>
  import("react-notion-x/build/third-party/code").then(async (m) => {
    await Promise.all([
      import('prismjs/components/prism-markup-templating.js'),
      import('prismjs/components/prism-markup.js'),
      import('prismjs/components/prism-bash.js'),
      import('prismjs/components/prism-c.js'),
      import('prismjs/components/prism-cpp.js'),
      import('prismjs/components/prism-csharp.js'),
      import('prismjs/components/prism-docker.js'),
      import('prismjs/components/prism-java.js'),
      import('prismjs/components/prism-js-templates.js'),
      import('prismjs/components/prism-coffeescript.js'),
      import('prismjs/components/prism-diff.js'),
      import('prismjs/components/prism-git.js'),
      import('prismjs/components/prism-go.js'),
      import('prismjs/components/prism-graphql.js'),
      import('prismjs/components/prism-handlebars.js'),
      import('prismjs/components/prism-less.js'),
      import('prismjs/components/prism-makefile.js'),
      import('prismjs/components/prism-markdown.js'),
      import('prismjs/components/prism-objectivec.js'),
      import('prismjs/components/prism-ocaml.js'),
      import('prismjs/components/prism-python.js'),
      import('prismjs/components/prism-reason.js'),
      import('prismjs/components/prism-rust.js'),
      import('prismjs/components/prism-sass.js'),
      import('prismjs/components/prism-scss.js'),
      import('prismjs/components/prism-solidity.js'),
      import('prismjs/components/prism-sql.js'),
      import('prismjs/components/prism-stylus.js'),
      import('prismjs/components/prism-swift.js'),
      import('prismjs/components/prism-wasm.js'),
      import('prismjs/components/prism-yaml.js')
    ])
    return m.Code
  })
)

아래 코드로 대체하여 해결하였습니다.

const Code = dynamic(() =>
  import("react-notion-x/build/third-party/code").then(
    (m) => m.Code
  )
)

[hyunjunhwang1994]

코드는 잘 나오나 하이라이트 기능이 동작안하는 것 같습니다