I have a Monaco Editor web component that needs URLs provided so it knows where to side-load the language-server-protocol service workers from
For context, this is an ESM -> ESM transform with the following command
esbuild --format=esm --bundle src/wc-monaco-editor.js --outfile=index.js
Here's the original source
const monacoDir = new URL('monaco/', import.meta.url)
self.MonacoEnvironment = {
getWorkerUrl: function (moduleId, label) {
if (label === 'json') {
return `${monacoDir}json.worker.js`
}
if (label === 'css') {
return `${monacoDir}css.worker.js`
}
if (label === 'html') {
return `${monacoDir}html.worker.js`
}
if (label === 'typescript' || label === 'javascript') {
return `${monacoDir}ts.worker.js`
}
return `${monacoDir}editor.worker.js`
}
}Which gets transformed to
const import_meta = {};
const monacoDir = new URL("monaco/", import_meta.url); // <-- import_meta.url isn't defined
self.MonacoEnvironment = {
getWorkerUrl: function(moduleId, label) {
if (label === "json") {
return `${monacoDir}json.worker.js`;
}
if (label === "css") {
return `${monacoDir}css.worker.js`;
}
if (label === "html") {
return `${monacoDir}html.worker.js`;
}
if (label === "typescript" || label === "javascript") {
return `${monacoDir}ts.worker.js`;
}
return `${monacoDir}editor.worker.js`;
}
};Note: RollupJS can bundle the same code without issue because it doesn't transform import.meta.url
BTW, tc39/proposal-import-meta is officially Stage 4
I have a Monaco Editor web component that needs URLs provided so it knows where to side-load the language-server-protocol service workers from
For context, this is an ESM -> ESM transform with the following command
Here's the original source
Which gets transformed to
Note: RollupJS can bundle the same code without issue because it doesn't transform
import.meta.urlBTW, tc39/proposal-import-meta is officially Stage 4