Jeden toolchain dla Twojego projektu webowego

Formatuj kod jak Prettier, oszczędzaj czas

Biome to szybki formatter dla JavaScript, TypeScript, JSX, TSX, JSON, HTML, CSS i GraphQL, który osiąga 97% kompatybilności z Prettier, oszczędzając czas CI i deweloperów.

Biome może nawet formatować niepoprawny kod podczas pisania w Twoim ulubionym edytorze.

KOD

function HelloWorld({greeting = "hello", greeted = '"World"', silent = false, onMouseOver,}) {

  if(!greeting){return null};

      // TODO: Don't use random in render
  let num = Math.floor (Math.random() * 1E+7).toString().replace(/.d+/ig, "")

  return <div className='HelloWorld' title={`You are visitor number ${ num }`} onMouseOver={onMouseOver}>

    <strong>{ greeting.slice( 0, 1 ).toUpperCase() + greeting.slice(1).toLowerCase() }</strong>
    {greeting.endsWith(",") ? " " : <span style={{color: 'grey'}}>", "</span> }
    <em>
  { greeted }
    </em>
    { (silent)
      ? "."
      : "!"}

    </div>;
}

WYNIK

function HelloWorld({
  greeting = "hello",
  greeted = '"World"',
  silent = false,
  onMouseOver,
}) {
  if (!greeting) {
    return null;
  }

  // TODO: Don't use random in render
  let num = Math.floor(Math.random() * 1E+7)
    .toString()
    .replace(/.d+/gi, "");

  return (
    <div
      className="HelloWorld"
      title={`You are visitor number ${num}`}
      onMouseOver={onMouseOver}
    >
      <strong>
        {greeting.slice(0, 1).toUpperCase() + greeting.slice(1).toLowerCase()}
      </strong>
      {greeting.endsWith(",") ? (
        " "
      ) : (
        <span style={{ color: "grey" }}>", "</span>
      )}
      <em>{greeted}</em>
      {silent ? "." : "!"}
    </div>
  );
}

WYDAJNOŚĆ

Biome

0.00s

Prettier

0.00s

~35x

Szybszy niż Prettier przy formatowaniu 171,127 linii kodu w 2,104 plikach z procesorem Intel Core i7 1270P.

Wypróbuj formatter Biome na playground lub bezpośrednio w swoim projekcie:

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome format --write ./src

Naprawiaj problemy, ucz się najlepszych praktyk

Biome to wydajny linter dla JavaScript, TypeScript, JSX, CSS i GraphQL, który zawiera 362 reguł z ESLint, TypeScript ESLint i innych źródeł.

Biome generuje szczegółowe i skontekstualizowane diagnostyki, które pomagają Ci poprawić kod i zostać lepszym programistą!

complexity/useFlatMap.js:2:1 lint/complexity/useFlatMap  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The call chain .map().flat() can be replaced with a single .flatMap() call.

    1 │ const array = ["split", "the text", "into words"];
  > 2 │ array.map(sentence => sentence.split(' ')).flat();
      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3 │ 

  ℹ Safe fix: Replace the chain with .flatMap().

    1 1 │   const array = ["split", "the text", "into words"];
    2   │ - array.map(sentence·=>·sentence.split('·')).flat();
      2 │ + array.flatMap(sentence·=>·sentence.split('·'));
    3 3 │   

Wypróbuj linter Biome na playground lub bezpośrednio w swoim projekcie:

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome lint --write ./src

Wszystko naraz

Nie tylko możesz formatować i lintować kod osobno, możesz to zrobić wszystko naraz jednym poleceniem!

Każde narzędzie integruje się bezproblemowo z innymi, tworząc spójny toolchain dla projektów webowych.

Uruchom wszystkie narzędzia poleceniem check:

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome check --write ./src

Szybki

Zbudowany w Rust z innowacyjną architekturą inspirowaną rust-analyzer.

Prosty

Zero konfiguracji potrzebnej do rozpoczęcia. Rozbudowane opcje dostępne gdy ich potrzebujesz.

Skalowalny

Zaprojektowany do obsługi codebase’ów dowolnej wielkości. Skup się na rozwoju produktu zamiast na narzędziach.

Praktyczny i informatywny

Unikaj niejasnych komunikatów o błędach, gdy mówimy Ci, że coś jest nie tak, mówimy dokładnie gdzie jest problem i jak go naprawić.

Wszystko w jednym

Od razu obsługa wszystkich funkcji językowych, których używasz dzisiaj. Pierwszorzędna obsługa TypeScript i JSX.

Wsparcie Organizacji

Oferujemy wsparcie komercyjne organizacjom, które go potrzebują przez naszą społeczność współtwórców.

Wypróbuj Biome

Zainstaluj Biome używając preferowanego menedżera pakietów I zintegruj go w swoim edytorze.

Zainstaluj z menedżerem pakietów

Zintegruj Biome w swoim edytorze

Trusted by leading organizations

Join thousands of developers and companies using Biome in production

AWS

Canonical

Cloudflare

Coinbase

Comcast

Discord

Google

Microsoft

n8n

Node.js

Slack

Socket

Uniswap

Vercel

Astro

View all users

Społeczność

Napędzane przez naszych współtwórców open-source

Discord

GitHub

BlueSky

Mastodon

Sponsors