chore: configure biome linter #616

maxmorozoff · 2024-11-04T18:19:32Z

This PR migrates project’s linting configuration from ESLint to Biome.
See: #538

Changes

Migrated configuration
Updated CI Action

Performance improvements:

With Biome, linting the project now takes only 45ms on my machine.

Known Issues

Not all ESLint rules have direct equivalents in Biome as noted in Biome's documentation.

khuezy · 2024-11-04T18:23:23Z

Thanks for the PR! I'm not familiar w/ biome so I'll defer to @conico974 and @vicb

vicb · 2024-11-04T18:49:59Z

I'll defer to @conico974 as he created the linked cleanup issue.

I usually agree with "if it ain't broken don't fix it" - especially when it comes to JS "build" tooling.

pkg-pr-new · 2024-11-04T20:35:31Z

Open in Stackblitz

pnpm add https://pkg.pr.new/@opennextjs/aws@616

commit: f1ed15d

conico974 · 2024-11-04T20:38:30Z

I usually agree with "if it ain't broken don't fix it" - especially when it comes to JS "build" tooling.

I kind of agree with that, but biome is so fast and it's a single deps that i think it may be worth it.

Unless there is a good reason to not merge this i think we should do it. I'll test that everything is working correctly tomorrow

khuezy · 2024-11-04T21:44:48Z

@maxmorozoff
With Biome, linting the project now takes only 45ms on my machine.
How long did it take eslint?

maxmorozoff · 2024-11-05T04:02:56Z

@maxmorozoff
With Biome, linting the project now takes only 45ms on my machine.
How long did it take eslint?

Around 40 seconds.
However, ESLint had more rules and plugins enabled.

You could consider enabling additional rules in Biome for a closer comparison.

As a temporary solution, we could run ESLint after Biome. This would have minimal impact on performance while allowing for a more gradual adoption, as it may require more fixes across the codebase.

vicb · 2024-11-05T10:27:49Z

I usually agree with "if it ain't broken don't fix it"

On the other hand, TS update is blocked by the current eslint config:

=============

WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.

You may find that it works just fine, or you may not.

SUPPORTED TYPESCRIPT VERSIONS: >=4.3.5 <5.4.0

YOUR TYPESCRIPT VERSION: 5.6.3

Please only submit bug reports when using the officially supported version.

=============

Switching to biome could fix that so that we can update TS - which would allow some code simplification, as newer TS have improved type inference

conico974

There is some missing stuff here.

And we probably want to either switch to recommended: true (and probably disable some rules that we don't need) or add more rules.

I don't think using eslint for other missing rule is a good idea, we either fully switch to biome or stick with eslint. There is no point in running multiple linters

conico974 · 2024-11-05T08:24:37Z

biome.json

+      "packages/open-next/src/minimize-js.ts"
+    ]
+  },
+  "formatter": { "enabled": false },


We do want to run the formatter, it was done by the prettier eslint plugin before

conico974 · 2024-11-05T08:25:02Z

biome.json

+      "**/pnpm-lock.yaml",
+      "**/dist/**",
+      "**/out/**",
+      "packages/open-next/assets/sharp-node-modules",


Not needed anymore

conico974 · 2024-11-05T08:25:28Z

biome.json

+      "**/dist/**",
+      "**/out/**",
+      "packages/open-next/assets/sharp-node-modules",
+      "packages/open-next/src/minimize-js.ts"


Why did you add this file ?

The minimize-js.ts has an eslint-disable comment. In Biome to ignore this file, it should be configured in biome.json (docs)

Other paths could be removed.

conico974 · 2024-11-05T08:26:37Z

biome.json

+    ]
+  },
+  "formatter": { "enabled": false },
+  "organizeImports": { "enabled": false },


We want that enabled as well

Should we configure formatting in biome.json or within a .editorconfig?

conico974 · 2024-11-05T11:25:03Z

biome.json

@@ -0,0 +1,57 @@
+{
+  "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
+  "vcs": { "enabled": false, "clientKind": "git", "useIgnoreFile": false },


We want this to be enabled and use the ignore files, otherwise it will try to lint a lot of useless files

maxmorozoff · 2024-11-05T13:16:13Z

switch to recommended: true

Biome summary:

Rule Name                                                    Diagnostics
  
  lint/complexity/noExcessiveCognitiveComplexity               1 (0 error(s), 1 warning(s), 0 info(s))
  lint/correctness/useExhaustiveDependencies                   1 (1 error(s), 0 warning(s), 0 info(s))
  lint/correctness/noUnnecessaryContinue                       1 (1 error(s), 0 warning(s), 0 info(s))
  lint/performance/noAccumulatingSpread                        13 (13 error(s), 0 warning(s), 0 info(s))
  lint/correctness/useJsxKeyInIterable                         14 (14 error(s), 0 warning(s), 0 info(s))
  lint/complexity/noUselessSwitchCase                          5 (5 error(s), 0 warning(s), 0 info(s))
  lint/style/noUnusedTemplateLiteral                           85 (72 error(s), 13 warning(s), 0 info(s))
  lint/style/useSelfClosingElements                            6 (6 error(s), 0 warning(s), 0 info(s))
  lint/suspicious/noImplicitAnyLet                             10 (10 error(s), 0 warning(s), 0 info(s))
  lint/suspicious/noArrayIndexKey                              2 (2 error(s), 0 warning(s), 0 info(s))
  lint/complexity/useLiteralKeys                               21 (21 error(s), 0 warning(s), 0 info(s))
  lint/style/useNumberNamespace                                16 (16 error(s), 0 warning(s), 0 info(s))
  lint/style/noInferrableTypes                                 14 (14 error(s), 0 warning(s), 0 info(s))
  lint/suspicious/noRedeclare                                  4 (4 error(s), 0 warning(s), 0 info(s))
  lint/style/noCommaOperator                                   2 (2 error(s), 0 warning(s), 0 info(s))
  lint/complexity/noForEach                                    37 (37 error(s), 0 warning(s), 0 info(s))
  lint/a11y/useIframeTitle                                     51 (51 error(s), 0 warning(s), 0 info(s))
  lint/a11y/useButtonType                                      6 (0 error(s), 6 warning(s), 0 info(s))
  lint/style/useTemplate                                       9 (9 error(s), 0 warning(s), 0 info(s))
  lint/a11y/useAltText                                         1 (1 error(s), 0 warning(s), 0 info(s))
  lint/style/useConst                                          21 (21 error(s), 0 warning(s), 0 info(s))
  lint/style/noVar                                             18 (18 error(s), 0 warning(s), 0 info(s))

Checked 299 files in 100ms. No fixes applied.
Found 318 errors.
Found 20 warnings.

After lint:fix:

Checked 299 files in 190ms. Fixed 24 files.
Found 268 errors.
Found 19 warnings.

Which rules would you like to keep?

changeset-bot · 2024-11-05T14:04:40Z

⚠️ No Changeset found

Latest commit: f1ed15d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

maxmorozoff · 2024-11-05T17:56:16Z

The current configuration lints the project with no errors but generates 2,091 warnings. Some rules have automated, safe fixes that could be applied to the codebase, while others have unsafe fixes.

Steps involved

Enabled all rules

{
  "linter": {
    "enabled": true,
    "rules": {
      "all": true
    }
  },
}

Saved lint report to json and extracted rule names with a script

Encountered some issues with the --reporter=json option, as it's experimental. I used yq as a workaround.

// $ pnpm lint --diagnostic-level=error --reporter=junit | yq -p=xml -o=json > report.json

import report from "./report.json";

const errors = report.testsuites.testsuite.filter(
  (testcase) =>
    testcase["+@errors"] &&
    testcase.testcase["+@name"].startsWith("org.biome.lint"),
);
const rulesSet = new Set(errors.map((testcase) => testcase.testcase["+@name"]));
const config = {};
rulesSet.forEach((rule) => {
  const [, , , pkg, name] = rule.split(".");
  config[pkg] = {
    all: true,
    ...config[pkg],
    [name]: "warn",
  };
});

console.log(JSON.stringify(config, null, 2));

conico974 · 2024-11-05T22:16:59Z

@maxmorozoff We don't want to enable all rule, that's for sure.
For the recommended one we can remove:

everything a11y related (as these probably only happens for the e2e test)
I'd remove the noForEach as well

The rest is probably fine, and we can apply the safe one in this PR.
For the unsafe one, we may have to look one by one and fix them in subsequent PR. As of now we can set them as warning and fix them later. We may want to add some other rule as well, but again in future PR

maxmorozoff · 2024-11-06T20:23:34Z

@conico974, the default value for recommended is true, so I've omitted it. Accessibility errors occurred in the examples/ directory. Should I disable these rules globally, or should we keep the recommended rules?
Also, should I update .vscode/settings.json and add .vscode/extensions.json?
Should I add the commit with fixes in .git-blame-ignore-revs?

conico974 · 2024-11-06T20:58:03Z

@maxmorozoff

Should I disable these rules globally, or should we keep the recommended rules?

Disable them, examples only contains e2e, we don't care that much about having perfect app there

Also, should I update .vscode/settings.json and add .vscode/extensions.json?
Should I add the commit with fixes in .git-blame-ignore-revs?

Good idea for both questions, go ahead

- Added .git-blame-ignore-revs file to exclude commit b36196d from `git blame` to improve readability by ignoring non-functional bulk edits made by Biome formatter and linter.

maxmorozoff · 2024-11-07T20:54:53Z

@conico974, could you please review the latest commits and let me know if they look good to you? Any additional feedback is also welcome!

Thank you!

khuezy · 2024-11-07T21:08:58Z

What do you think of adding --diagnostic-level=error. When I try biome lint it includes a bunch of warns

I'm playing around w/ biome and it's really fast!

conico974 · 2024-11-07T22:16:09Z

What do you think of adding --diagnostic-level=error. When I try biome lint it includes a bunch of warns

My advice is that we should fix those warning (or disable them if we feel they're useless) just not in this PR, i just want to avoid a 300 files changed PR where it would be way too easy to miss something that might break something (especially with the eslint plugin we have that can replace code)

I'm playing around w/ biome and it's really fast!

Yeah i've tested it a bit and it's so fast, it seems almost unreal 😆. There is a bunch of new javascript tooling around lately that are insane speed wise (like the oxc project)

conico974

I just have 2 question here, but if everything is fine we should merge this
As for what's need to be done next, we need to either ignore or fix the lint rule, in this order : suspicious, correctness, performance, complexity and lastly style.
When all of this is done we'll need to think if we want to add other rule

.editorconfig

conico974 · 2024-11-07T22:22:32Z

biome.jsonc

+      },
+      "style": {
+        "noUnusedTemplateLiteral": "warn",
+        "noInferrableTypes": "warn", // safe fix


Did you apply these safe fixes ? If so no need to set them as warn, we want to avoid them as much as possible so an error is fine

I've only applied the fixes that were causing formatting or import order errors, which I forgot to mention. Now, running pnpm lint exits with 0, while pnpm lint:fix would apply additional linting fixes. It might be better to address these in the next PR, as they are more nuanced and might not be necessary if some rules are disabled.

vicb · 2024-11-08T06:42:29Z

great work on this PR!

I read "like the oxc project" and I'm puzzled by how the JS world like to fuel the confusion... biome use to be rome and oxc is now void0 🤷

conico974 · 2024-11-08T08:12:20Z

biome use to be rome and oxc is now void0

And biome use oxc under the hood and oxc also have a linter 🤯

conico974

LGTM Thanks a lot for this

maxmorozoff · 2024-11-08T16:15:31Z

@conico974 Thank you! Would you like me to open the next PR to address the linting warnings, or do you plan to handle it later? Happy to help!

conico974 · 2024-11-08T16:22:15Z

@maxmorozoff i'd be happy if you open them yeah

conico974 · 2024-11-08T16:23:51Z

Maybe i spoke too soon, looks like @vicb is already taking care of a bunch of them

vicb · 2024-11-08T17:07:08Z

#627 should conflict with #626 and I don't think I'll have time to work on the PR before Tuesday, so up to you.

sommeeeer · 2024-11-08T17:08:17Z

Good job @maxmorozoff and everyone else on this PR

conico974 requested changes Nov 5, 2024

View reviewed changes

maxmorozoff added 2 commits November 6, 2024 20:37

chore(lint): move to biome instead of eslint (opennextjs#538)

4da249a

chore(lint): apply biome safe fixes

b36196d

maxmorozoff force-pushed the configure-biome branch from a602b93 to b36196d Compare November 6, 2024 19:45

maxmorozoff added 5 commits November 7, 2024 18:06

chore: add .git-blame-ignore-revs with bulk formatting/linting changes

0d8974b

- Added .git-blame-ignore-revs file to exclude commit b36196d from `git blame` to improve readability by ignoring non-functional bulk edits made by Biome formatter and linter.

chore(lint): disable a11y rules in biome config

2938f64

chore(vscode): add biome extension to recommended

32d08db

chore(vscode): configure biome as default formatter

2c7127e

chore(lint): update lint script to include format and import sort checks

80872ba

conico974 reviewed Nov 7, 2024

View reviewed changes

chore: remove .editorconfig in favor of Biome configuration

f1ed15d

conico974 approved these changes Nov 8, 2024

View reviewed changes

conico974 merged commit 04379e2 into opennextjs:main Nov 8, 2024
3 checks passed

chore: configure biome linter #616

chore: configure biome linter #616

Uh oh!

Conversation

maxmorozoff commented Nov 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changes

Performance improvements:

Known Issues

Uh oh!

khuezy commented Nov 4, 2024

Uh oh!

vicb commented Nov 4, 2024

Uh oh!

pkg-pr-new bot commented Nov 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

conico974 commented Nov 4, 2024

Uh oh!

khuezy commented Nov 4, 2024

Uh oh!

maxmorozoff commented Nov 5, 2024

Uh oh!

vicb commented Nov 5, 2024

Uh oh!

conico974 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

maxmorozoff commented Nov 5, 2024

Uh oh!

changeset-bot bot commented Nov 5, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

maxmorozoff commented Nov 5, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Steps involved

Enabled all rules

Saved lint report to json and extracted rule names with a script

Uh oh!

conico974 commented Nov 5, 2024

Uh oh!

maxmorozoff commented Nov 6, 2024

Uh oh!

conico974 commented Nov 6, 2024

Uh oh!

maxmorozoff commented Nov 7, 2024

Uh oh!

khuezy commented Nov 7, 2024

Uh oh!

conico974 commented Nov 7, 2024

Uh oh!

conico974 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

vicb commented Nov 8, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

conico974 commented Nov 8, 2024

Uh oh!

conico974 left a comment

maxmorozoff commented Nov 4, 2024 •

edited

Loading

pkg-pr-new bot commented Nov 4, 2024 •

edited

Loading

changeset-bot bot commented Nov 5, 2024 •

edited

Loading

maxmorozoff commented Nov 5, 2024 •

edited

Loading

vicb commented Nov 8, 2024 •

edited

Loading