bundle codemirror w/ rollup

app.js

@@ -1,8 +1,51 @@
+// based on basicSetup https://github.com/codemirror/basic-setup/blob/main/src/codemirror.ts
+
+const editorSrc = `import {keymap, highlightSpecialChars, drawSelection, highlightActiveLine, dropCursor,
+        rectangularSelection, crosshairCursor,
+        lineNumbers, highlightActiveLineGutter} from '@codemirror/view'
+import {EditorState} from '@codemirror/state'
+import {defaultHighlightStyle, syntaxHighlighting, indentOnInput, bracketMatching,
+        foldGutter, foldKeymap} from '@codemirror/language'
+import {defaultKeymap, history, historyKeymap} from '@codemirror/commands'
+import {searchKeymap, highlightSelectionMatches} from '@codemirror/search'
+import {autocompletion, completionKeymap, closeBrackets, closeBracketsKeymap} from '@codemirror/autocomplete'
+import {lintKeymap} from '@codemirror/lint'
+
+/* */export const basicSetup = (() => [
+  lineNumbers(),
+  highlightActiveLineGutter(),
+  highlightSpecialChars(),
+  history(),
+  foldGutter(),
+  drawSelection(),
+  dropCursor(),
+  EditorState.allowMultipleSelections.of(true),
+  indentOnInput(),
+  syntaxHighlighting(defaultHighlightStyle, {fallback: true}),
+  bracketMatching(),
+  closeBrackets(),
+  autocompletion(),
+  rectangularSelection(),
+  crosshairCursor(),
+  highlightActiveLine(),
+  highlightSelectionMatches(),
+  keymap.of([
+    ...closeBracketsKeymap,
+    ...defaultKeymap,
+    ...searchKeymap,
+    ...historyKeymap,
+    ...foldKeymap,
+    ...completionKeymap,
+    ...lintKeymap
+  ])
+])()`
+
 function log(message, cls = 'cyan') {
   const el = document.createElement('pre')
   el.classList.add(cls)
   el.innerText = message
   document.body.append(el)
+  ;(el.scrollIntoViewIfNeeded ?? el.scrollIntoView).call(el)
 }
 
 class App {
@@ -113,10 +156,10 @@ class App {
       )
       script.text = new TextDecoder().decode(ab)
     } else {
-      script.text = await resp.text
+      script.text = await resp.text()
       script.sha = resp.integrity
     }
-    log('[downloaded] ' + url, 'green')
+    log('[downloaded] ' + url + ` [${script.text.length}]`, 'green')
     return script.text
   }
 
@@ -127,6 +170,25 @@ class App {
     document.head.append(s)
   }
 
+  get loaderPlugin() {
+    return {
+      name: 'loader',
+      resolveId: async source => {
+        if (source === 'editor.js' || source in this.scripts) {
+          return source
+        }
+      },
+      load: async id => {
+        if (id === 'editor.js') {
+          return editorSrc
+        } else if (id in this.scripts) {
+          log(`[found] ${id}`)
+          return this.scripts[id].text
+        }
+      },
+    }
+  }
+
   async run() {
     await Promise.allSettled(
       this.topLevelDeps.map(dep => (
@@ -134,9 +196,13 @@ class App {
       ))
     )
     await Promise.allSettled(this.downloads)
-    //await this.loadScript('@rollup/browser')
+    await this.loadScript('@rollup/browser')
-    //const { rollup } = window.rollup
+    const { rollup } = window.rollup
-    //output.value = `${typeof rollup}`
+    const input = 'editor.js'
+    const plugins = [this.loaderPlugin]
+    const bundle = await rollup({input, plugins})
+    const {output} = await bundle.generate({format: 'es'})
+    log(output[0].code)
   }
 }