Update dependencies & simplify monaco cross-domain worker setup#241
Update dependencies & simplify monaco cross-domain worker setup#241MaxGraey merged 1 commit intoAssemblyScript:mainfrom
Conversation
MaxGraey
changed the title
MaxGraey
changed the title
MaxGraey
changed the title
| const MONACO_BASE_URL = `https://cdn.jsdelivr.net/npm/monaco-editor@${MONACO_VERSION}/min/` | ||
|
|
||
| window.MonacoEnvironment.getWorkerUrl = (moduleId, label) => { | ||
| const workerUrl = oldGetWorkerUrl(moduleId, label) | ||
| const { isSame, url } = isSameOrigin(workerUrl) | ||
|
|
||
| /* istanbul ignore else */ | ||
| if (isSame) return workerUrl | ||
| else { | ||
| let blob | ||
| try { | ||
| blob = new Blob([`importScripts('${url}');`], { type: 'application/javascript' }) | ||
| } catch (e) { | ||
| const blobBuilder = new window.BlobBuilder() | ||
| blobBuilder.append(`importScripts('${url}');`) | ||
| blob = blobBuilder.getBlob('application/javascript') | ||
| } | ||
| return window.URL.createObjectURL(blob) | ||
| function crossDomainWorker() { | ||
| window.MonacoEnvironment = { | ||
| getWorkerUrl() { | ||
| const proxy = ` | ||
| self.MonacoEnvironment = { baseUrl: '${MONACO_BASE_URL}' }; | ||
| importScripts('${MONACO_BASE_URL}vs/base/worker/workerMain.js'); | ||
| ` | ||
| return URL.createObjectURL(new Blob([proxy], { type: 'application/javascript' })) |
There was a problem hiding this comment.
Wondering if some of these things served a real purpose. Say when Monaco runs on some hot reload capable dev server, do we perhaps want to preserve an existing Monaco environment instead of unconditionally creating a new one and leak the old? Or do we need same origin handling in some odd configurations (like in dev)? The previous try-catch there looks like some compatibility fallback, can that still be relevant nowadays?
Iirc, originally I basically copied whatever Monaco documented. Well possible that there is generally a better way today, one that doesn't even use AMD anymore.
There was a problem hiding this comment.
New implementation based on this tutorial:
https://log.schemescape.com/posts/web-development/embedding-monaco-from-cdn.html
and it looks like this typical approach after monaco-editor >= v0.52.x
https://github.com/egoist/vue-monaco/blob/master/README.md?plain=1#L122
With one exception, I decided to preserve data url creation via URL.createObjectURL
There was a problem hiding this comment.
Ah. I was also wondering if there is a more modern ESM-aware way of doing the setup nowadays. Have you checked?
There was a problem hiding this comment.
2 participants
No description provided.