Как разминифицировать JavaScript: утилиты для командной строки

Пройдите тест, узнайте какой профессии подходите

Я предпочитаю
0%
Работать самостоятельно и не зависеть от других
Работать в команде и рассчитывать на помощь коллег
Организовывать и контролировать процесс работы

Быстрый ответ

Для быстрой трансформации минифицированного JavaScript кода в удобочитаемый формат, используйте функцию «Прекрасное отображение» (Pretty Print) в Инструментах разработчика Chrome (Chrome DevTools) или утилиту uglify-js, при работе с Node.js:

  1. Нажмите F12 для вызова Инструментов разработчика и перейдите на вкладку "Источники".
  2. Выберите минифицированный файл .js.
  3. Кликните по иконке {} внизу экрана для форматирования кода.

В альтернативе, примените следующую команду в терминале:

shell
Скопировать код
npx uglify-js yourFile.min.js -b -o beautifiedFile.js

Давайте теперь подробнее рассмотрим методы распаковки.

Кинга Идем в IT: пошаговый план для смены профессии

Детальные методы распаковки

Удобные Онлайн-Инструменты

Многочисленные онлайн-сервисы, включая JSBeautifier.org, предоставляют простую и удобную возможность преобразования минифицированного кода в форматированный и читаемый вид:

  • Перейдите на сайт JSBeautifier.org, вставьте ваш код и нажмите кнопку «Форматировать» (Beautify).

Возможности Вашего Браузера

Браузеры располагают встроенными инструментами разработки, которые поддерживают возможность декомпрессии JS:

  • Пользователи Firefox могут воспользоваться методом toSource для декомпрессии JavaScript.
  • IE9 и более новые версии также поддерживают декомпрессию JavaScript в своих инструментах разработки F12.

Эти инструменты незаменимы в процессе отладки в реальном времени или в процессе разработки прямо в браузере.

Волшебство Командной Строки

Любители терминала и работы с файлами могут использовать JSBeautifier:

shell
Скопировать код
# Вуаля, волшебство в действии... 
js-beautify -r -o formatted.js minified.js

Эта команда выполняет декомпрессию и заменяет (-r) минифицированный файл форматированным.

Визуализация

Визуализируем процесс с использованием эмодзи:

Markdown
Скопировать код
Сжатый JS:  🧩🔍...🧩🔍  // Настоящий кошмар для разработчика!

Распакованный JS: 🖼️✨  // Вау! Теперь всё стало понятно.

И вот наши основные помощники:

Markdown
Скопировать код
| Инструмент     | Действие        |
| -------------- | ----------------|
| JS Beautifier  | 🧩➡️🖼️ | // Превращает кошмар в прекрасный сон
| Prettyfy       | 🧩🔄🖼️ | // Исправляет кошмар
| Source Map     | 🧩🗺️🖼️ | // Проложит путь сквозь кошмар, найдет сон

Эти инструменты помогают возвращать коду его естественную привлекательность и читабельность, освобождая его от минифицированного хаоса.

Полезные вещи на заметку

Отладка Используя Карты Источников

С использованием карт источников мы можем сопоставлять минифицированный код с его прекрасно форматированным аналогом:

  • Разработчики могут использовать карты источников для более сложных ситуаций при отладке.

Работа с Особо Сложной Минификацией

Иногда минифицированный код может быть оптимизирован настолько глубоко, что его сложно преобразовать назад:

  • Если вы столкнулись с немедленно вызываемым функциональным выражением (IIFE), создающим проблемы, заключите его в {} перед использованием прекрасного отображения.

Полезные материалы

  1. Онлайн красивое форматирование JavaScript — мультифункциональное решение для улучшения вашего JavaScript кода.
  2. Декомпрессия JS, CSS, HTML, XML и JSON файлов — весьма полезный инструмент для декомпрессии файлов.
  3. Использование карт источников — Документация по Инструментам разработчика Firefox — детальная информация о том, как использовать карты источников с помощью Инструментов разработчика Firefox.
  4. Инструменты разработчика Chrome — официальная документация по Инструментам разработчика Chrome, неоценимый ресурс для любого разработчика.
  5. GitHub – mishoo/UglifyJS — подборка полезных инструментов для работы с JavaScript.
  6. Babel — опробуйте компиляцию современного JavaScript прямо в браузере с помощью Babel.
  7. de4js — инструмент для деобфускации и распаковки JavaScript кода.