Skip to content

Instantly share code, notes, and snippets.

@curran
Last active April 5, 2019 12:25
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save curran/a92a2848ea9ffd59eb9a0a9e443c43b9 to your computer and use it in GitHub Desktop.
Save curran/a92a2848ea9ffd59eb9a0a9e443c43b9 to your computer and use it in GitHub Desktop.
[unlisted] CodeMirror 6 Prerelease Example
license: mit
<!doctype html>
<meta charset=utf8>
<title>CM6 demo</title>
<link rel="stylesheet" href="https://unpkg.com/@datavis-tech/codemirror-6-prerelease@4.4.0/codemirror.next/legacy-modes/style/codemirror.css">
<script src="https://unpkg.com/@datavis-tech/codemirror-6-prerelease@4.4.0/dist/codemirror.js"></script>
<style>
.codemirror { height: 300px; overflow: auto; border: 1px solid silver}
</style>
<body>
<h1>CM6</h1>
<div id=editor></div>
<script>
let {
EditorState,
EditorView,
keymap,
history,
redo,
redoSelection,
undo,
undoSelection,
lineNumbers,
baseKeymap,
indentSelection,
legacyMode,
matchBrackets,
javascript,
specialChars,
multipleSelections
} = CodeMirror;
let mode = legacyMode({mode: javascript({indentUnit: 2}, {})})
let isMac = /Mac/.test(navigator.platform)
let state = EditorState.create({doc: `"use strict";
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
const {readFile} = require("fs");
readFile("package.json", "utf8", (err, data) => {
console.log(data);
});
`, extensions: [
lineNumbers(),
history(),
specialChars(),
multipleSelections(),
mode,
matchBrackets(),
keymap({
"Mod-z": undo,
"Mod-Shift-z": redo,
"Mod-u": view => undoSelection(view) || true,
[isMac ? "Mod-Shift-u" : "Alt-u"]: redoSelection,
"Ctrl-y": isMac ? undefined : redo,
"Shift-Tab": indentSelection
}),
keymap(baseKeymap),
]})
let view = new EditorView({state})
document.querySelector("#editor").appendChild(view.dom)
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment