Один інструментарій для вашого веб-проєкту

Форматуй код як Prettier, заощаджуй час

Biome - це швидкий форматувальник для JavaScript, TypeScript, JSX, TSX, JSON, CSS та GraphQL, який має 97% сумісність з Prettier, заощаджуючи час CI та розробників.

Biome може навіть форматувати некоректний код під час написання у вашому улюбленому редакторі.

КОД

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>;
}

ВИХІД

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>
  );
}

ПРОДУКТИВНІСТЬ

Biome

0.00s

Prettier

0.00s

В ~35 разів

Швидше за Prettier при форматуванні 171,127 рядків коду у 2,104 файлах з Intel Core i7 1270P.

Спробуйте форматувальник Biome на пісочниці або безпосередньо у вашому проєкті:

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

Виправляйте проблеми, вивчайте найкращі практики

Biome - це продуктивний лінтер для JavaScript, TypeScript, JSX, CSS та GraphQL, який містить 293 правил з ESLint, TypeScript ESLint та інших джерел.

Biome видає детальні та контекстуалізовані діагностики, які допомагають покращити ваш код та стати кращим програмістом!

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 │   

Спробуйте лінтер Biome на пісочниці або безпосередньо у вашому проєкті:

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

Все одразу

Ви можете не тільки форматувати та лінтити ваш код окремо, але й робити це все одразу за допомогою однієї команди!

Кожен інструмент інтегрується бездоганно з іншими, створюючи єдиний інструментарій для веб-проєктів.

Запустіть всі інструменти за допомогою команди check:

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

Швидкий

Створений на Rust та інноваційній архітектурі, натхненній rust-analyzer.

Простий

Нульова конфігурація для початку роботи. Широкі можливості налаштування для тих випадків, коли вони потрібні.

Масштабований

Розроблений для обробки кодових баз будь-якого розміру. Зосередьтеся на розвитку продукту, а не інструментів.

Дієвий та Інформативний

Уникайте незрозумілих повідомлень про помилки, коли ми повідомляємо про проблему, ми точно вказуємо, де вона знаходиться і як її виправити.

З усіма необхідними функціями

Підтримка всіх мовних функцій, які ви використовуєте сьогодні. Першокласна підтримка TypeScript та JSX.

Підтримка для підприємств

Ми пропонуємо комерційну підтримку організаціям, які її потребують, через нашу спільноту учасників.

Спробуйте Biome

Встановіть Biome за допомогою вашого улюбленого менеджера пакетів та інтегруйте його у ваш редактор.

Встановити за допомогою менеджера пакетів

Інтегрувати Biome у ваш редактор

Спільнота

Підтримується нашими опен-соурсними контрибуторами

Discord

GitHub

BlueSky

Mastodon

Спонсори