Load monaco-editor from the CDN

package.json

@@ -26,12 +26,12 @@
   "homepage": "https://github.com/open-formulieren/monaco-json-editor#readme",
   "devDependencies": {
     "@types/react": "^18.2.79",
+    "monaco-editor": "^0.48.0",
     "prettier": "^3.2.5",
     "typescript": "^5.4.5"
   },
   "dependencies": {
-    "@monaco-editor/react": "^4.6.0",
-    "monaco-editor": "^0.48.0"
+    "@monaco-editor/react": "^4.6.0"
   },
   "peerDependencies": {
     "react": "^18.0.0"

src/jsonEditor.tsx

@@ -1,9 +1,11 @@
-import * as monaco from 'monaco-editor';
 import {Editor, loader} from '@monaco-editor/react';
 import type {EditorProps, OnChange, OnMount} from '@monaco-editor/react';
 
-// This is required to *not* fetch the editor from CDNs:
-loader.config({monaco});
+// Loading from a CDN to avoid having to setup specific Webpack configuration
+// which doesn't play well (especially with Storybook).
+// See https://www.npmjs.com/package/@monaco-editor/loader#configure-the-loader-to-load-the-monaco-as-an-npm-package
+// if we ever want to switch to the NPM module instead.
+loader.config({paths: {vs: 'https://cdn.jsdelivr.net/npm/monaco-editor@0.48.0/min/vs'}});
 
 interface JSONEditorProps {
   value?: any;