Add Biome.js for local linting

sidharthv96 commented 1 week ago

:bookmark_tabs: Summary

Adds Biome.js for local linting and formatting.

:straight_ruler: Design Decisions

ESLint has been causing memory issues, and the pre-commit hook is really slow. Replacing pre-commit hook with biome enhances the productivity.

Pros:

Fast & light (won't take minutes for every commit)
Has import sorting, without removing unused imports. Cons:
Does not support all rules (No type aware rules, so we will still need eslint in CI)
Not all errors will be caught in pre-commit, and CI will fail. But it's better than waiting minutes for each commit, or eslint crashing everytime.

TODO:

[x] Remove rules in eslint that are supported in biome.

:clipboard: Tasks

Make sure you

[ ] :book: have read the contribution guidelines
[ ] :computer: have added necessary unit/e2e tests.
[ ] :notebook: have added documentation. Make sure MERMAID_RELEASE_VERSION is used for all new features.
[ ] :bookmark: targeted develop branch

netlify[bot] commented 1 week ago

Deploy Preview for mermaid-js ready!

Name	Link
Latest commit	94fa23514fd17ecb2305082fc0aae274e2d47ecf
Latest deploy log	https://app.netlify.com/sites/mermaid-js/deploys/66793a980bbda10008486c0d
Deploy Preview	https://deploy-preview-5587--mermaid-js.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

argos-ci[bot] commented 1 week ago

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build	Status	Details	Updated (UTC)
default (Inspect)	✅ No changes detected	-	Jun 24, 2024, 9:34 AM

codecov[bot] commented 1 week ago

Codecov Report

Attention: Patch coverage is 2.32558% with 168 lines in your changes missing coverage. Please review.

Project coverage is 5.73%. Comparing base (ce3b0af) to head (94fa235).

Additional details and impacted files

[![Impacted file tree graph](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587/graphs/tree.svg?width=650&height=150&src=pr&token=BaET4V1BdM&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js)](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js) ```diff @@ Coverage Diff @@ ## develop #5587 +/- ## ========================================== - Coverage 5.73% 5.73% -0.01% ========================================== Files 278 280 +2 Lines 42019 42038 +19 Branches 516 492 -24 ========================================== Hits 2409 2409 - Misses 39610 39629 +19 ``` | [Flag](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js) | Coverage Δ | | |---|---|---| | [unit](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js) | `5.73% <2.32%> (-0.01%)` | :arrow_down: | Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#carryforward-flags-in-the-pull-request-comment) to find out more. | [Files](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?dropdown=coverage&src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js) | Coverage Δ | | |---|---|---| | [.esbuild/build.ts](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.esbuild%2Fbuild.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LmVzYnVpbGQvYnVpbGQudHM=) | `0.00% <0.00%> (ø)` | | | [.esbuild/jisonPlugin.ts](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.esbuild%2FjisonPlugin.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LmVzYnVpbGQvamlzb25QbHVnaW4udHM=) | `0.00% <0.00%> (ø)` | | | [.esbuild/util.ts](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.esbuild%2Futil.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LmVzYnVpbGQvdXRpbC50cw==) | `0.00% <0.00%> (ø)` | | | [.eslintrc.cjs](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.eslintrc.cjs&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LmVzbGludHJjLmNqcw==) | `0.00% <0.00%> (ø)` | | | [.lintstagedrc.mjs](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.lintstagedrc.mjs&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LmxpbnRzdGFnZWRyYy5tanM=) | `0.00% <0.00%> (ø)` | | | [.vite/jsonSchemaPlugin.ts](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=.vite%2FjsonSchemaPlugin.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-LnZpdGUvanNvblNjaGVtYVBsdWdpbi50cw==) | `0.00% <0.00%> (ø)` | | | [...ckages/mermaid/src/diagrams/gantt/ganttRenderer.js](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=packages%2Fmermaid%2Fsrc%2Fdiagrams%2Fgantt%2FganttRenderer.js&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-cGFja2FnZXMvbWVybWFpZC9zcmMvZGlhZ3JhbXMvZ2FudHQvZ2FudHRSZW5kZXJlci5qcw==) | `0.00% <0.00%> (ø)` | | | [...ges/mermaid/src/diagrams/state/stateRenderer-v2.js](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=packages%2Fmermaid%2Fsrc%2Fdiagrams%2Fstate%2FstateRenderer-v2.js&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-cGFja2FnZXMvbWVybWFpZC9zcmMvZGlhZ3JhbXMvc3RhdGUvc3RhdGVSZW5kZXJlci12Mi5qcw==) | `0.00% <0.00%> (ø)` | | | [packages/mermaid/src/diagrams/timeline/styles.js](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=packages%2Fmermaid%2Fsrc%2Fdiagrams%2Ftimeline%2Fstyles.js&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-cGFja2FnZXMvbWVybWFpZC9zcmMvZGlhZ3JhbXMvdGltZWxpbmUvc3R5bGVzLmpz) | `0.00% <0.00%> (ø)` | | | [packages/mermaid/src/docs/.vitepress/config.ts](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree&filepath=packages%2Fmermaid%2Fsrc%2Fdocs%2F.vitepress%2Fconfig.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js#diff-cGFja2FnZXMvbWVybWFpZC9zcmMvZG9jcy8udml0ZXByZXNzL2NvbmZpZy50cw==) | `0.00% <0.00%> (ø)` | | | ... and [26 more](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587?src=pr&el=tree-more&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js) | | ... and [1 file with indirect coverage changes](https://app.codecov.io/gh/mermaid-js/mermaid/pull/5587/indirect-changes?src=pr&el=tree-more&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=mermaid-js)

sidharthv96 commented 6 days ago

Thanks for the eslint-plugin-oxlint suggestion, @aloisklink. I've added that. I don't think we should put extra effort to split this into two separate PRs, as the formatting changes are very minimal, and biome replaces prettier pretty good. Biome and oxc are both viable options, and we can switch to oxc in case we have any hiccups with biome, or we have a strong benefit with oxc.

mermaid-js / mermaid