JavaScript форматиране и минимизиране

Как да форматирате или минимизирате JavaScript

1. Поставете кода си или щракнете Отвори файл, за да заредите файл .js, .mjs или .jsx (до 10 МБ).
2. Изберете Отстъп и, ако предпочитате стила на Allman, отметнете Скобите на отделен ред.
3. Щракнете Форматирай, за да направите кода четим.
4. За да го смалите, задайте Опции за минимизиране и щракнете Минимизирай. За да потърсите само грешки, щракнете Провери синтаксиса.
5. Копирайте или изтеглете резултата. Редът със състоянието показва размера преди и след и спестения процент.

Кодът само се чете и преобразува, но никога не се изпълнява: нищо, което поставите, не се изпълнява на тази страница.

Форматиране с js-beautify

Форматирай използва js-beautify. Той поставя по един оператор на ред, отстъпва блоковете, добавя интервали около операторите и след ключовите думи и запазва до един празен ред там, където сте имали. Разбира и съвременния синтаксис (класове, стрелкови функции, шаблонни низове, async/await) и JSX. Това е най-бързият начин да прочетете минимизирана библиотека или фрагмент на един ред, копиран от уеб страница.

Форматирането променя само интервалите. Не проверява дали кодът е валиден: липсваща скоба просто дава странен отстъп. За това използвайте Провери синтаксиса.

Минимизиране с Terser

Минимизирай използва Terser – минификатора на повечето инструменти за изграждане на JavaScript. Тъй като е голям, се изтегля само когато щракнете Минимизирай или Провери синтаксиса за първи път. Опциите съответстват директно на настройките на Terser:

• ES модул (import/export) разбира кода като модул (module: true): прилага се строг режим, а имената на най-горно ниво са частни, така че могат да се преименуват, а неизползваните – да се премахнат. Оставете го неотметнато за класически скрипт, чиито глобални функции се ползват от други скриптове.
• Компресирай (compress) пренаписва кода в по-кратък равностоен код: изчисляване на константи (2*60 става 120), премахване на мъртъв код, обединяване на декларации var, по-кратки условия.
• Скъси имената на променливите (mangle) преименува локалните променливи и параметри на една или две букви. Глобалните имена и свойствата на обекти никога не се преименуват.
• Запази лицензните коментари запазва коментарите, започващи с /*! или съдържащи @license или @preserve. Всички останали коментари се премахват.

Минимизирането не може да промени какво прави кодът, но код, който разчита на имена на функции (fn.name) или на eval, може да се държи различно след преименуването. В такъв случай махнете отметката от Скъси имената на променливите.

Синтактични грешки с ред и колона

Когато Terser не може да анализира кода, Минимизирай и Провери синтаксиса показват съобщението за грешка с реда и колоната ѝ, например „Ред 12, колона 8 – Синтактична грешка: Unexpected token punc «)»“. Колоната брои символите от 1. Честа причина е липсваща скоба по-рано във файла, затова погледнете и редовете точно преди съобщената позиция.