Бабель, ты не знаешь
Что приходит вам на ум, когда речь заходит о вавилоне?
- Вы можете преобразовать es6, es7 и другой код в проекте в код, поддерживаемый целевой средой.
- Может автоматически заполнять API-интерфейсы, которые не поддерживаются целевой средой.
- taro (небольшой инструмент для перевода программ) реализован на основе babel
- Плагины Babel очень богаты
- Наша компания теперь использует babel для компиляции машинописного текста вместо tsc.
- На основе Babel я сделал функцию автоматического отслеживания, и меня похвалил руководитель.
- ...
На самом деле, babel может делать больше, чем это, он может делать 3 вида вещей:
Перевод esnext, машинописного текста, потока и т. д. в js, поддерживаемый целевой средой.
Это наиболее часто используемая функция, которая используется для преобразования нового синтаксиса esnext, машинописного текста и потока в коде в реализацию, основанную на синтаксисе, поддерживаемом целевой средой. И вы также можете полифилить API, которые не поддерживаются целевой средой.
Babel7 поддерживает предустановленную среду, вы можете указать цели для преобразования по запросу, преобразование более точное, а продукт меньше.
Некоторые преобразования кода для конкретных целей
Babel — это транспилятор, предоставляющий множество API-интерфейсов, которые можно использовать для синтаксического анализа кода в AST, преобразования AST и создания объектного кода.
Разработчики могут использовать его для выполнения некоторых специальных преобразований, таких как инструментирование функций (автоматическая вставка некоторого кода в функции, например скрытого кода), автоматическая интернационализация, импорт по умолчанию в именованный импорт и т. д.
Популярный инструмент для перевода небольших программ taro реализован на базе API Babel.
Статический анализ кода
После анализа кода возможно преобразование, поскольку код можно понять через структуру AST. После понимания кода, помимо преобразования и генерации объектного кода, его также можно использовать для анализа информации кода и выполнения некоторых проверок.
Что еще может сделать Бабель?
Babel — незаменимый инструмент для фронтенд-разработки бизнеса и разработки цепочек инструментов, мы используем его каждый день, но задумывались ли вы когда-нибудь над этими вопросами:
- Как написать плагин для Babel для преобразования пользовательского кода?
- Где Babel можно использовать для автоматизации в развитии бизнеса?
- Как реализован бабел?
и
- Как реализован линтер?
- Как работает проверка машинописного текста?
- Каков принцип работы инструмента обфускации сжатия?
- Как инструменты упаковки анализируют зависимости кода?
- Как автоматически создается документация по API?
Всего вышеперечисленного можно добиться с помощью babel, возможно, вы не думали, что у babel есть такая великая сила,Изучение Babel определенно повысит ваш рейтинг.
Реализовать полную цепочку инструментов на основе Babel
Давайте взглянем на идеи реализации этих инструментов (все перечисленные ниже инструменты имеюткод реализациина гитхабе)
автоматическая интернационализация
Интернационализация — это способ замены жестко запрограммированных строковых литералов значениями из пакетов ресурсов.Babel может анализировать строковые литералы в коде, заменять их оператором вызова функции, а затем автоматически импортировать пакеты ресурсов. На основе Babel мы можем сделать автоматическую интернационализацию.
Автоматически генерировать документацию API
Когда мы пишем api, мы добавим комментарии выше, поэтому можем ли мы извлечь содержимое этих комментариев и информацию о связанных функциях и классах и использовать определенный шаблон для создания документов API? Да, Babel может это сделать.
linter
Мы используем eslint и stylelint для проверки спецификаций кода в течение всего дня, на самом деле они просто проверяют AST, что мы можем сделать с помощью babel. eslint можно реализовать на основе babel.
type checker
Typescript добавляет в код информацию о статическом типе. Он может выполнять проверку типов во время компиляции, а также может помочь в интеллектуальных подсказках кода. Теперь это в основном необходимый навык для интерфейса. Но задумывались ли вы когда-нибудь о том, как реализован машинописный текст? в буклетеМы напишем программу проверки типов ts вручную, чтобы вы действительно поняли машинопись!
Обфускация сжатия
Производство внешнего кода должно быть сжато и запутано.Мы используем это в течение всего дня, но знаете ли вы его принцип реализации?Можем ли мы использовать Babel для его реализации? Ответ да, вбуклетсерединаРеализуем функцию сжатия и обфускации.
JS-интерпретатор
Каков принцип реализации движка v8 и как интерпретируемый язык интерпретирует код. Можем ли мы реализовать интерпретатор js, да,«Читы для очистки плагина Babel»В буклете мы реализуем интерпретатор js на основе парсера babel.
рукописный вавилон
Вы можете спросить, все вышеперечисленное основано на Вавилоне, а что, если его нет?
Без Babel мы реализуем Babel,буклетНаконецМы реализуем простой, но полезный Babel, чтобы вы могли действительно понять принцип Babel и по-настоящему освоить Babel..
Содержимое интерпретатора и проверка типов выше,Ван Инь продал 12000, см. картинку ниже, так что этот буклет определенно стоит того.
контур
Содержимое многих буклетов было сказано выше, и следующее является полной оглавлением буклетов:
не просто вавилон
Хотя приведенный выше фактический бой основан на Babel, но вы изучаете только Babel?
Нет, приведенный выше практический случай включает в себя полную цепочку инструментов, от генерации документа, проверки типов, сжатия и обфускации до интерпретатора js и т. д. Это почти замкнутый цикл разработки интерфейса.Взяв это за отправную точку, мы узнали о реализации всей цепочки инструментов..
Вышеупомянутые инструменты по-прежнему сосредоточены в области внешнего интерфейса, но идеи реализации транслятора и интерпретатора действительно универсальны.Принцип компиляции в основном заключается в изучении трех частей компилятора, транслятора и интерпретатора.Узнайте полную книгу, я верю, что это также может помочь вам начать компиляцию.
Суммировать
Babel — почти необходимый инструмент во фронтенде, на его основе можно выполнять множество функций и даже строить всю цепочку инструментов.буклетБудет реализован ряд функций, таких как линтер, проверка типов, обфускация сжатия, автоматическая генерация документов API, интерпретатор js и так далее. Среди них функции интерпретатора и проверки типов можно продать в Wang Yin за 12 000. Напротив, содержание и цена этого буклета абсолютно добросовестны.
Если Babel API — это техника, то принципы компиляции и идеи реализации наборов инструментов, усвоенные Babel, — это путь. Освоение babel, освоение цепочки инструментов и начало работы с принципами компиляции определенно повысят ваш рейтинг.
Ссылка на брошюру:sourl.co/v3Wygf