Explanation

The rendered portion of BlockNote is in React, and a wrapper is designed around it to make its integration seamless in Vue. In other words, no React integration is required on the developer's part; simply using the component 'as-is' will work. No configuration is required in the bundler (Vite, Rollup, ...) and React does not need to be imported.

Some limitations of that approach are:

• A React app is created for each instance of the BlockNote editor
• Communication with the editor is handled using events, as React and Vue events aren't compatible
• React versions need to be aligned ; if an application is using a given version and the BlockNote Headless module is using another, some problems may arise

Related

Headless Blocknote Editor Reference