prosemirror boilerplate

This commit is contained in:
Greg Shuflin 2024-10-26 03:21:19 -07:00
parent b13c5dcee6
commit 0491984ad3
5 changed files with 53 additions and 1 deletions

Binary file not shown.

View File

@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tauri App</title>
<script type="module" src="/src/main.ts" defer></script>
<script type="module" src="/src/prosemirror.ts" defer></script>
</head>
<body>
@ -39,5 +40,8 @@
</form>
<p id="greet-msg"></p>
</main>
<div id="editor"></div>
<div id="content">test</div>
</body>
</html>

View File

@ -11,7 +11,12 @@
},
"dependencies": {
"@tauri-apps/api": "^2",
"@tauri-apps/plugin-shell": "^2"
"@tauri-apps/plugin-shell": "^2",
"prosemirror-example-setup": "^1.2.3",
"prosemirror-schema-basic": "^1.2.3",
"prosemirror-schema-list": "^1.4.1",
"prosemirror-state": "^1.4.3",
"prosemirror-view": "^1.34.3"
},
"devDependencies": {
"@tauri-apps/cli": "^2",

View File

@ -1,5 +1,27 @@
import { invoke } from "@tauri-apps/api/core";
import {EditorState} from "prosemirror-state"
import {EditorView} from "prosemirror-view"
import {Schema, DOMParser} from "prosemirror-model"
import {schema} from "prosemirror-schema-basic"
import {addListNodes} from "prosemirror-schema-list"
import {exampleSetup} from "prosemirror-example-setup"
// Mix the nodes from prosemirror-schema-list into the basic schema to
// create a schema with list support.
const mySchema = new Schema({
nodes: addListNodes(schema.spec.nodes, "paragraph block*", "block"),
marks: schema.spec.marks
})
window.view = new EditorView(document.querySelector("#editor"), {
state: EditorState.create({
doc: DOMParser.fromSchema(mySchema).parse(document.querySelector("#content")),
plugins: exampleSetup({schema: mySchema})
})
})
let greetInputEl: HTMLInputElement | null;
let greetMsgEl: HTMLElement | null;

21
scribe/src/prosemirror.ts Normal file
View File

@ -0,0 +1,21 @@
import {EditorState} from "prosemirror-state"
import {EditorView} from "prosemirror-view"
import {Schema, DOMParser} from "prosemirror-model"
import {schema} from "prosemirror-schema-basic"
import {addListNodes} from "prosemirror-schema-list"
import {exampleSetup} from "prosemirror-example-setup"
// Mix the nodes from prosemirror-schema-list into the basic schema to
// create a schema with list support.
const mySchema = new Schema({
nodes: addListNodes(schema.spec.nodes, "paragraph block*", "block"),
marks: schema.spec.marks
})
window.view = new EditorView(document.querySelector("#editor"), {
state: EditorState.create({
doc: DOMParser.fromSchema(mySchema).parse(document.querySelector("#content")),
plugins: exampleSetup({schema: mySchema})
})
})