Directory structure:
BlockNote
├── packages/core - The core of the editor, which includes all logic to get the editor running in vanilla JS.
├── packages/react - A React wrapper and UI for the editor. Requires additional components for the UI.
├── packages/ariakit - UI components for the `react` package, made with Ariakit.
├── packages/mantine - UI components for the `react` package, made with Mantine.
├── packages/shadcn - UI components for the `react` package, made with Shadcn.
├── packages/server-util - Utilities for converting BlockNote documents into static HTML for server-side rendering.
├── packages/dev-scripts - A set of tools for converting example editor setups into components for the BlockNote website.
├── examples - Example editor setups used for demos in the BlockNote website and playground.
├── docs - Code for the BlockNote website.
├── playground - A basic page where you can quickly test each of the example editor setups.
└── tests - Playwright end to end tests.
An introduction into the BlockNote Prosemirror schema can be found in packages/core/src/pm-nodes/README.md.
To run the project, open the command line in the project's root directory and enter the following commands:
# Install all required npm modules for lerna, and bootstrap lerna packages
npm install
npm run bootstrap
# Start the example project
npm start
- Add the dependency to the relevant
package.json
file (packages/xxx/package.json) - run
npm run install-new-packages
- Double check
package-lock.json
to make sure only the relevant packages have been affected
Package | Size | Version |
---|---|---|
@blocknote/core | ||
@blocknote/react | ||
@blocknote/ariakit | ||
@blocknote/mantine | ||
@blocknote/shadcn | ||
@blocknote/server-util |