Summary

First of all, apologies for the massive file diff. It was unfortunately unavoidable as every package.json file in the repo has had its vite dep swapped with vite-plus, and every unit test file's vitest import path has also been changed to vite-plus/test.

With that out of the way, here's a breakdown of what the migration involves:

Dev server & building

Basically nothing has changed here. We were already using Vite for this and we are still using Vite, so our existing scripts and configs work out of the box.

Linting & formatting

We were using ESLint and Prettier for this, which have been swapped out for oxlint and oxfmt as part of Vite+. The new formatting is almost the same as before, though you will still see some formatting changes in the diff. These fall into 3 categories:

1. Files that were not formatted previously but should have been, htmlToMarkdown.ts for example. This file was not formatted properly, evident by things like {return ...;}.
2. Formatting changes in docs files. These were due to NextJS having its own opinionated formatting that took priority over the root Prettier config. Now, everything uses the same format provided by Vite+.
3. TailwindCSS class ordering in docs React components. Vite+ comes with Tailwind class ordering built-in, which uses a slightly different order to the Prettier plugin we were using. Can probably be configured, haven't looked into it because the component files are reformatted anyway per the previous category.

Also, not all of the ESLint rules we were using have equivalents in oxlint:

• import/no-cycle: Does have an oxlint equivalent, but is somehow more strict and reports several hundred issues. Set to only warn instead of error until we either revert to the ESLint version or fix the issues.
• import/no-extraneous-dependencies/import/extensions: No oxlint equivalents, so the ESLint import plugin is still installed and these rules are passed to oxlint. This is not ideal as they are still written in JS, which negates some of the performance improvement we get from oxlint's Rust rules.

Testing

Our unit tests are pretty much unchanged as we were already using Vitest (short of import paths). The only issue I'm running into is with the Vitest VSCode extension which seems to not be running the setup code, as snapshots have randomized block IDs. Running the test script seems to work fine though.

For e2e tests, I haven't converted our Playwright tests to Vitest Browser Mode yet. This PR is already kind of huge and I don't want to inflate the diff even more, so that will come in a separate PR, as there will be quite a bit to go over there.

Monorepo scripts & releases

The majority of monorepo functionality, i.e. using a single script to run multiple scripts across packages, is now handled by Vite Task as opposed to NX. This also includes caching of script results, though it works a bit differently now.

NX would invalid script results based on package dependencies. For example, if a file in @blocknote/core would be changed, the build script cache would be invalidated for that package, as well as all dependant packages. With Vite+, this is more granular. File dependencies are checked instead of package dependencies, so even if a file in @blocknote/core is changed, the cache is only invalidated for dependent packages which actually use that file.

This is good but could be better - there are some files (e.g. ones generated by TypeScript) which can trigger false positive cache invalidations. Fixing this would require moving from scripts to Vite tasks, which is out of scope for this PR. Read more about avoiding unnecessary cache invalidations here.

One feature of NX that does not have an alternative in Vite+ is publishing of NPM packages. This is still TODO as we figure out a way around this. For now, release scripts & GitHub actions have been disabled.

Rationale

Vite+ should simplify and speed up our tooling a lot. It employs pretty much the same stack we are already using for the block-view project, and it's worked well for us there.

Simplification

Vite+ bundles together DX, bundling, testing, and more that is currently split between:

• Vite
• ESLint
• Prettier
• Vitest
• Playwright
• NX

Speedup

Vite+ uses oxlint and oxfmt for linting & formatting which are rust based and substantially faster than ESLint and Prettier.

Additionally, Vitest Browser Mode should also speed up our e2e tests quite a bit vs Playwright (will be done in a separate PR though).

Changes

See above for general changes.

There are also a few specific changes that are worth explaining:

• .nvmrc has been renamed to .node-version. It still does the same thing, but is recognized by a variety of applications and not just NVM.
• .vite-hooks/pre-commit is auto added by the Vite+ migration utility.
• nx.json has been heavily cut down as it is not only responsible for releases - other functionality is handled by Vite Task.
• vite-plus is given the version range "catalog:", which ensures the same version is used across packages.
• packages/dev-scripts/gen.ts has had its JSON serialization updated to match oxfmt formatting.
• GitHub actions have been updated to remove NX and use the voidzero-dev/setup-vp@v1 script for setting up the Vite+, the package manager, and dependencies, instead of installing them separately.

Impact

See summary.

Testing

See summary.

Screenshots/Video

N/A

Checklist

• Code follows the project's coding standards.
• Unit tests covering the new feature have been added.
• All existing tests pass.
• The documentation has been updated to reflect the new feature

Additional Notes

Things to consider/fix:

• Alternative to NX for NPM package releases.