Автоматизация разработчика с NPX и Commander

Чем больше я узнаю о разработке JavaScript, тем больше я подвергаюсь воздействию инструментов сборки и конфигурации JavaScript. Такие инструменты, как вавилон и веб-пакет, сорвать меня. Конфи инструменты, волшебное программное обеспечение радости, которое устанавливает все ваши инструменты сборки для вас через волшебный эльфа-пыль или что-то, чтобы вы могли просто написать код, те очаровывают меня.

Я желаю что мы имело больше для WordPress и одни хитов сделали вещи точно путь я думаю что они должно быть сделано. Мне очень не нравится использовать языки шаблонов для шаблонирования кода. Это то, что остановило меня от создания моих собственных строительных лесов инструменты раньше. Я всегда строю плагин, который делал вещи так, как я хотел, чтобы мой шаблон делать вещи, а затем скопировал плагин в каталог шаблонов моего сгенерированного, а затем вручную добавил строки замены. Отладка была болью.

Моя новая цель состоит в том, чтобы сохранить плагин, который имеет справочный случай для каждой вещи, которую я хотел бы плагин, чтобы сделать — composer.json, Гутенберг блоков, PHP прямого впрыска контейнера и т.д. — и строительные леса инструмент, который может скопировать из этого плагина.

Я решил написать его в узлах, чтобы я мог легко поделиться им через npm, и быть в состоянии запустить его локально, в контейнере Docker или даже в приложении Без сервера. Это был хороший повод, чтобы узнать больше о модулье файловой системы Узла и npx.

Как комфортно с NPX

NPX — это инструмент, который позволяет запускать пакеты узлов из любой точки мира, не устанавливая их в первую очередь. Он идеально подходит для приложений строительных лесов инструменты, которые вы только изредка использовать. Вместо того, чтобы держать копию установленной локально, вы запустите версию на npm. Например, для создания приложения react можно установить на вашем компьютере приложение для создания среакции, или использовать приложение NPX create-react-app для выполнения одного и того же и никогда не беспокоиться о том, чтобы держать его в актуальном состоянии или съесть пространство для хранения.

Если вы не знакомы с NPX, который входит в npm, я рекомендую читать вступительный пост о NPX.

Во вступительном посте Кэт показывает, как выполнять JavaScript, хранящийся в github gist. Как она отмечает, это удаленное выполнение кода, что потенциально крайне опасно. Итак, первый шаг для запуска этого скрипта— прочитайте источник кода, который вы собираетесь выполнить, второй шаг решит, хотите ли выполнить его, а третий шаг — вызвать удаленное выполнение кода.

Давай сделаем это. Во-первых, перейдите к https://gist.github.com/zkat/4bc19503fe9e9309e2bfaa2c58074d32 и посмотреть на сценарий. Последний раз я посмотрел его просто вызвало консоли сообщение для регистрации. Убедись, что она не изменилась. Если это так, то нет:

Просмотр кода на Gist.

Это приведет к тому, что сообщение будет журнал.

Запуск пакета с локальным путем. Так что это здорово, мы можем разработать сценарий, хранящийся в качестве суть для нашей автоматизации. Но опыт развития будет плохим. Если мы должны нажать и вытащить код из суть, то тест, который будет медленным. Я лучше протестую код локально.

Да, я мог бы запустить код непосредственно с узлами, то есть. переключиться на локальный каталог и запустить узла index.js или любой другой. То, что я действительно хочу, это использовать версию разработки в контексте. Что делать, если я мог бы использовать npx /npx-это-круто из любой точки на моем компьютере, чтобы использовать локальную версию разработки npx-это-круто?

Оказывается, npx может использовать локальный путь файла, так что это возможно. Давайте пройдем через то, как он покажет вам некоторые основы того, как работает npx.

Во-первых, скачать копию этой сутью. Поместите его в основной каталог пользователя и измените название каталога на «npx-is-cool». Затем откройте index.js, и вы увидите:

Просмотр кода на Gist.

Это довольно основной сценарий, изменить его выход на что-то более весело, как «Я Бэтмен», так что вы можете доказать, что ваша локальная версия используется и потому, что вы Бэтмен.

Просмотр кода на Gist.

Теперь вы можете запустить эту команду из любого места на вашем компьютере, чтобы использовать свой собственный npx-это-круто

Просмотр кода на Gist.

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

Да, я также хочу, чтобы нажать мои изменения в удаленном управлении версией и сделать пакет доступен через npm. Но, когда я развиваюсь, я не хочу думать об управлении релизами.

Введите командира

Команда, которая выводит только «Привет Рой»

Просмотр кода на Gist.

Автоматизация разработчика с командиром

Использование узлов для работы с локальными и удаленными файлами

Для чего-то практического, я создал команду, которая копирует два файла, которые копирует два файла PHP я использую для загрузки активов для приложения React в плагинword WordPress и изменить там пространство имен.

Для этого нам понадобятся четыре вещи:

  1. Функция загрузки файла с удаленного URL в локальную.
  2. Функция, используюва первую функцию, а затем изменяет пространство имен в полученном файле.
  3. Функция, которая вызывает эти функции будет правильный аргумент
  4. Команда для вызова этой функции.

Давайте пройдем через список. Я не хочу, чтобы написать полный учебник по системе файла узлов, но вот ваш краш-курс.

В «Узде» мы используем файловую систему — прочитайте и напишите файлы, например, используя «fs». Например, чтобы проверить, существует ли файл:


 

Модуль fs довольно читается. Эта функция называется «existsSync». Он проверяет — синхронно — если файл существует. Мы можем написать файл с fs, синхронно используя fs.writeSync().

Если вы не привыкли требовать(). Это приводит значение модуля.экспорт из файла, который вы указываете, в область. Например, если у вас есть файл «foo.js» и внутри у вас есть module.exports и функция foo() Затем, когда вы используете const foo и требуют (./foo’); из файла в том же каталоге, что функция в настоящее время хранится в const foo. Мы можем оставить от пути файла — требуют (‘реагировать’) — для доступа к модулю в каталоге узлов, в данном случае, экспорт узлов/модулей /реакции/index.js

Вот модуль для обработки загрузки файла через https — с помощью модуля https — и писать его в файл с помощью fs модуль:

Просмотр кода на Gist.

Обратите внимание, что на последней строке — module.exports и скачать. Загрузка является ссылкой на функцию, поэтому, когда мы требуем этот файл, эта функция может быть пригощена к удобо. Вот как мы используем его в нашем следующем модуле.

Вот модуль для загрузки файла и изменить его PHP имя пространстве.


Если вы все еще привыкаете к требуемым() посмотрите на разницу между требуемым для загрузки и для замены в файлах. Первый начинается с пути файла ‘./’, поэтому узла ищет файл. Другой нет, так что он выглядит в узловых модулей.

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

Создание командования

Теперь пришло время, чтобы обернуть все это в команду, чтобы мы могли ввести npx кальдера-бывший клиент-активов / мой плагин Поставщик / Пакет и получить наши скрипты скопированы на q /my-plugin с именем пространства Поставщик / Пакет.

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

Просмотр кода на Gist.

В функции команды () слова в квадратных скобках становятся переменными, передаваемыми функции «действия». Действие функции связано с простым обратным вызовом, который вызывает функцию, созданную на последнем этапе.

Теперь вы берете команду

Мне нравится узнать больше о частях JavaScript, что я обычно не получить для работы с из-за только с помощью JavaScript для переднего конца dev. Узнать, как узлы узла структурированы помогли мне понять больше о том, что веб-пакет абстрагируется. Я также узнал больше о файловой системе.

Что еще более важно, я работаю над моим npx приложение, которое должно спасти меня и мою команду времени. Если вы думаете, что такой инструмент может сэкономить время вашей команды, раскидись и сделать свой собственный. На меня на Twitter @josh412 или оставить комментарий с тем, что вы создаете.

Источник: torquemag.io

Добавить комментарий

%d такие блоггеры, как: