Drop ESLint and Prettier for Biome #1848

Kocal · 2024-05-15T06:53:48Z

Q	A
Bug fix?	no
New feature?	no
Issues	Fix #...
License	MIT

Hi everyone,

Biome is a new modern tool for code linting and formatting.
It supports TypeScript out-of-the-box, lint and format does not conflict each-other (like ESLint and Prettier can do), and it's super fast!
With Biome, we can easily replace:

ESLint
ESLint's TypeScript plugin
Prettier
ESLint's Prettier plugin

There is a lot of modifications, but 99% of them are:

use import type ... / import { type ... } when necessary
removing 'use strict', since we have type: 'module' in package.json files, but I'm not 100% confidente here and I may add them back
using template string interpolation instead of + operator

I've disabled the following linting rules in order to reduce the number of modifications, but later we can start to enable them:

complexity/noStaticOnlyClass
complexity/noForEach
style/noParameterAssign
performance/noDelete

The yarn scripts lint, format, check-lint and check-format have been modified in consequences.

For performance comparisons, you can check those two CI jobs:

https://github.com/symfony/ux/actions/runs/9063481176/job/24899508211, ESLint took ~19s and Prettier took ~2s
https://github.com/symfony/ux/actions/runs/9091422430/job/24985996787, Biome took ~5s for linting and ~0s for formatting

For the number of commits, I wanted to ease the review by doing many atomic commits, but feel free to squash if necessary.

WDYT?

Kocal · 2024-05-15T07:10:34Z

Failures are unrelated

smnandre · 2024-05-15T07:55:44Z

I cannot resist to answer with: https://dayssincelastjavascriptframework.com/

(and now more seriously i'll look at your post 😅 )

smnandre · 2024-05-15T07:58:16Z

(first read: you know how to speak to me :) )

Kocal · 2024-05-15T08:14:16Z

Yeah I know about the 0 day since the last JS framework/tools meme... and trust me it's not for nothing my TN is "JS hate account"

Biome is a community-fork from Rome (started 3 years ago), it's a tool I was really looking forward to because of the over-fragmentation of JavaScript tools and the unnecessarily complex configurations to make them work together.
I love having a tool that does a lot, but mostly well. ... <troll>Next PR, Bun to replace Yarn/Vitest/Rollup? 👀 </troll>)

I consider Biome enough "production-ready", to nicely and quickly lint and format our JS(X)/TS(X) files.

WebMamba · 2024-05-15T09:28:19Z

What about editor integration? Did you tried the PHPstorm extension? Do you think it's mature enough?

Kocal · 2024-05-15T10:48:30Z

I didn't know an extension existed, and so I didn't try it. But I'm not a big fan of ESLint/Prettier integration in IDEs, I prefer relying on CLI / CI / pre-commit hook :D

smnandre · 2024-05-17T03:18:46Z

I'll try it next week (late in the week) !

src/Svelte/composer.json

smnandre · 2024-05-17T03:20:46Z

src/TogglePassword/assets/src/controller.ts

@@ -57,7 +55,7 @@ export default class extends Controller<HTMLInputElement> {
        button.classList.add(...this.buttonClassesValue);
        button.setAttribute('tabindex', '-1');
        button.addEventListener('click', this.toggle.bind(this));
-        button.innerHTML = this.visibleIcon + ' ' + this.visibleLabelValue;
+        button.innerHTML = `${this.visibleIcon} ${this.visibleLabelValue}`;


Is this worth the change ?

Yes, string concatenation with + is a mistake

smnandre · 2024-05-17T03:25:41Z

package.json

-    "workspaces": [
-        "src/*/assets"
-    ],
+    "workspaces": ["src/*/assets"],
    "scripts": {
        "build": "node bin/build_javascript.js && node bin/build_styles.js",
        "test": "bin/run-vitest-all.sh",


Any impact on those two ? (build / test)

Mmmh nope, it is not related to Biome and they still works

javiereguiluz · 2024-07-30T11:07:28Z

This looks like a nice addition. Do you think this is ready for merge or would you like to wait for more feedback and/or changes? Thanks!

Kocal · 2024-07-30T11:13:57Z

Hey, I think this PR would need a last rebase on main before merging.
I will do it this afternoon

Kocal · 2024-07-30T12:52:06Z

The PR has been rebased and CI checks are passing, feel free to merge it if you like it 👀

javiereguiluz · 2024-07-30T16:00:44Z

Let's merge this now so we can fully test it for real in the project and see how it goes.

Thanks Hugo!

…rn workspaces (Kocal) This PR was squashed before being merged into the 2.x branch. Discussion ---------- imp(biomejs): upgrade Biomejs, fix patterns, don't use yarn workspaces | Q | A | ------------- | --- | Bug fix? | yes/no | New feature? | yes/no  | Issues | Fix #...  | License | MIT Following #1848: - It looks like glob pattern like `src/*/{src,test}` (the `{a,b}` part) were not working - I've configured files to lint/format in our `biome.json`. - I've also upgraded Biomejs to ^1.8.3 - I've rerun Biome lint/format on the whole codebase Sorry for the big PR 🙏🏻 Commits ------- 304bfae imp(biomejs): upgrade Biomejs, fix patterns, don't use yarn workspaces

carsonbot added the Status: Needs Review Needs to be reviewed label May 15, 2024

smnandre reviewed May 17, 2024

View reviewed changes

src/Svelte/composer.json Outdated Show resolved Hide resolved

smnandre reviewed May 17, 2024

View reviewed changes

Kocal force-pushed the chore/replace-eslint-and-prettier-by-biomejs branch from e65d382 to 97dd32d Compare May 17, 2024 08:29

Kocal force-pushed the chore/replace-eslint-and-prettier-by-biomejs branch from 97dd32d to 79953e3 Compare May 28, 2024 07:07

Kocal force-pushed the chore/replace-eslint-and-prettier-by-biomejs branch from 79953e3 to a999295 Compare June 25, 2024 05:50

Kocal force-pushed the chore/replace-eslint-and-prettier-by-biomejs branch from a999295 to ffa391b Compare July 30, 2024 12:48

Drop ESLint and Prettier for Biome

b406997

javiereguiluz force-pushed the chore/replace-eslint-and-prettier-by-biomejs branch from 2d41195 to b406997 Compare July 30, 2024 16:00

javiereguiluz merged commit 3732365 into symfony:2.x Jul 30, 2024
7 of 8 checks passed

Kocal deleted the chore/replace-eslint-and-prettier-by-biomejs branch July 30, 2024 17:37

Kocal mentioned this pull request Jul 30, 2024

imp(biomejs): upgrade Biomejs, fix patterns, don't use yarn workspaces #2015

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Drop ESLint and Prettier for Biome #1848

Drop ESLint and Prettier for Biome #1848

Kocal commented May 15, 2024 •

edited

Loading

Kocal commented May 15, 2024

smnandre commented May 15, 2024

smnandre commented May 15, 2024

Kocal commented May 15, 2024 •

edited

Loading

WebMamba commented May 15, 2024

Kocal commented May 15, 2024

smnandre commented May 17, 2024

smnandre May 17, 2024

Kocal May 17, 2024

smnandre May 17, 2024

Kocal May 17, 2024

javiereguiluz commented Jul 30, 2024

Kocal commented Jul 30, 2024

Kocal commented Jul 30, 2024

javiereguiluz commented Jul 30, 2024

Drop ESLint and Prettier for Biome #1848

Drop ESLint and Prettier for Biome #1848

Conversation

Kocal commented May 15, 2024 • edited Loading

Kocal commented May 15, 2024

smnandre commented May 15, 2024

smnandre commented May 15, 2024

Kocal commented May 15, 2024 • edited Loading

WebMamba commented May 15, 2024

Kocal commented May 15, 2024

smnandre commented May 17, 2024

smnandre May 17, 2024

Choose a reason for hiding this comment

Kocal May 17, 2024

Choose a reason for hiding this comment

smnandre May 17, 2024

Choose a reason for hiding this comment

Kocal May 17, 2024

Choose a reason for hiding this comment

javiereguiluz commented Jul 30, 2024

Kocal commented Jul 30, 2024

Kocal commented Jul 30, 2024

javiereguiluz commented Jul 30, 2024

Kocal commented May 15, 2024 •

edited

Loading

Kocal commented May 15, 2024 •

edited

Loading