editor icon indicating copy to clipboard operation
editor copied to clipboard

[BUG] markdownShortcutPlugin throws "Prism is not defined" error when minified

Open dylanpyle opened this issue 1 year ago • 4 comments

  • [x] I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
  • [x] I have read the documentation and cannot find an answer.

Describe the bug When the markdownShortcutPlugin is enabled - if you build your project using esbuild (a very popular bundler, also used in Vite/etc) with --minify enabled, at runtime the app throws the following error:

bundle.js:170 Uncaught ReferenceError: Prism is not defined

Reproduction As this is specific to a build process, I've set up a new minimal reproduction repo here as I'm not sure it's possible in codesandbox? https://github.com/dylanpyle/mdxeditor-esbuild

To Reproduce

Steps to reproduce the behavior:

  • Clone the repo
  • npm install
  • ./compile
  • open index.html
  • Observe the runtime error

To confirm that it's specific to the markdownShortcutPlugin, remove this plugin from app.tsx and run ./compile again; observe that the app now loads successfully.

Expected behavior The app loads the editor.

Screenshots Screenshot 2024-06-12 at 11 48 51

Screenshot 2024-06-12 at 11 49 23

Desktop (please complete the following information):

  • OS: macOS
  • Browser: Chrome 126.0.6478.57
  • Dependencies:
  "dependencies": {
    "@mdxeditor/editor": "3.4.1",
    "esbuild": "0.21.5",
    "react": "18.3.1",
    "react-dom": "18.3.1"
  }

Additional context

This issue is not present when the output bundle is not minified.

dylanpyle avatar Jun 12 '24 15:06 dylanpyle