Search code examples
javascriptnode.jsnpmcodemirrorcodemirror-6

what is the usage section on a codemirror 6 language pack?

If you go to (eg) https://github.com/exercism/codemirror-lang-elixir?tab=readme-ov-file you'll find:

import { StreamLanguage } from '@codemirror/language'
import { elixir } from 'codemirror-lang-elixir'

const lang = StreamLanguage.define(elixir)

Or on https://github.com/livebook-dev/codemirror-lang-elixir

import { EditorView } from "@codemirror/view";
import { basicSetup } from "codemirror";
import { elixir } from "codemirror-lang-elixir";

new EditorView({
  parent: document.querySelector("#editor"),
  extensions: [basicSetup, elixir()],
});

What is that? Seriously, imagine I'm a five year old: what would you call it, what does it mean, where does it go, how could I ever actually run and test and in fact just see it in action?

[The following questions are all essentially just a rewording of "what is it?"]

It is some sort of JavaScript, right?

It is some sort of JavaScript that cannot be run in a web browser, right?

It is some sort of JavaScript that cannot be run on Windows 10, amistillright?

Should there be some sort of npm init / build / rollup / bundle / parcel or such somewhere?

Is there a step that converts that typescript (??) into something more useful?

PS: just to clarify, I'm not actually interested in elixir at all, it is entirely incidental the two I happened to pick were that, any language would do, legacy mode or lezer-based.

Solution

  • It is javascript. It is not typescript.

    You can follow the links in the README.md files you have linked, which eventually will lead you to codemirror.net, which states:

    CodeMirror is a code editor component for the web. It can be used in websites to implement a text input field with support for many editing features, and has a rich programming interface to allow further extension.

    There is a guide under the section "Example: Bundling with Rollup".

    I'm not familiar with CodeMirror (or Elixir), so I'm not 100% sure, but this is what it seems to be to me:

    • CodeMirror is an online code editor
    • It runs in the web browser, but because of the complexity, a compile and bundle step is necessary, which transforms the javascript code that you can edit "comfortably" into something more practical to be run in the browser.
    • There are several modules for different programming languages.
    • The language "Elixir" seems to be not supported by the original package, but there is a separate NPM package codemirror-lang-elixir that adds support for "Elixir".
    • you need to install CodeMirror and the language module that you want. Then you can edit the code to create the code editor, then compile it, then you should be able to (probably serve it (?) and) run it in the browser. (The documentation should provide the necessary details.)
    • I don't see why it should not run under Windows 10 (?)