Форматувальник і мініфікатор коду

Що таке Форматувальник і мініфікатор коду?

Безкоштовний онлайн-форматувальник і мініфікатор коду, який форматує або мініфікує HTML, CSS і JavaScript, не залишаючи ваш браузер. Виберіть мову, потім виберіть «Форматувати», щоб заново розставити відступи в неохайному чи однорядковому джерелі з відступом у 2 пробіли, 4 пробіли чи табуляцію, або «Мініфікувати», щоб стиснути його. Форматування виконується за допомогою js-beautify; мініфікація JavaScript використовує Terser для скорочення імен і зменшення розміру, а CSS і HTML стискаються завдяки видаленню коментарів і згортанню надлишкових пробілів. Веброзробники використовують його, щоб зробити мініфікований сторонній код читабельним, зменшити таблиці стилів і скрипти перед розгортанням, а також упорядкувати фрагменти, вставлені з виводу збірки.

Як користуватися Форматувальник і мініфікатор коду

1. Виберіть мову вашого джерела: HTML, CSS або JS.
2. Виберіть дію: «Форматувати» для оформлення або «Мініфікувати» для стискання.
3. Для форматування виберіть відступ: 2 пробіли, 4 пробіли або Табуляція.
4. Вставте або введіть код у поле введення — результат оновлюється автоматично.
5. Натисніть кнопку «Копіювати», щоб отримати результат, або натисніть «Очистити», щоб спорожнити поле введення й почати заново.

Приклади

a{color:red;font-weight:bold}

a {
  color: red;
  font-weight: bold
}

function add(first, second) {
  return first + second;
}

function add(n,d){return n+d}

<ul>
  <li>One</li>
  <li>Two</li>
</ul>

<ul><li>One</li><li>Two</li></ul>

Поширені запитання

Чи завантажується мій код на сервер?

Ні. Форматування і мініфікація повністю виконуються локально у вашому браузері — js-beautify і Terser завантажуються як скрипти й працюють на вашому пристрої. Ваш код ніколи не залишає вашу машину, а інструмент продовжує працювати офлайн.

Які мови та дії підтримуються?

Три мови — HTML, CSS і JavaScript — кожна з двома діями: «Форматувати» (оформити з вибраним відступом) і «Мініфікувати» (стиснути). JavaScript мініфікується за допомогою Terser, а CSS і HTML стискаються завдяки видаленню коментарів і згортанню пробілів.

Який відступ я можу вибрати?

Під час форматування ви можете заново розставити відступи у 2 пробіли, 4 пробіли або символом табуляції. Відступ застосовується лише до форматування; мініфікація видаляє пробіли й ігнорує це налаштування.

Чому під час мініфікації мого JavaScript зʼявилася помилка?

Terser розбирає ваш JavaScript перед мініфікацією, тож синтаксична помилка зупиняє його, і повідомлення показується над виводом. Виправте вказане місце — часто це незакрита дужка, рядок чи зайвий токен — і результат пересобереться автоматично.

Чи оновлюється вивід сам собою?

Так. Результат пересобирається щоразу, коли ви змінюєте введення, мову, дію чи відступ, тож вам ніколи не потрібно натискати кнопку для форматування — просто скопіюйте вивід, коли він має правильний вигляд.