Эта история также была размещена в моем личном блоге.
Что за шлепок?
Plop - это небольшой пакет узлов, который упростит вашу жизнь, когда вам понадобится создать новый контроллер / маршрутизатор / помощник /…
Эй, чертовски легко создать новый контроллер: скопируйте и вставьте другой код контроллера, удалите определенные строки, которые вы не будете использовать. Тадааа!
Что ж, теперь задайте кучу законных вопросов:
- О каком «другом» контроллере вы говорите? Более свежие? Самый «лучший» код? Есть ли там какой-нибудь эталонный контроллер?
- Как я могу понять предыдущее, если я еще не эксперт по кодовой базе проекта?
- Как убедиться, что я правильно назвал новый файл? Когда я удаляю строки, которые считаю «бесполезными»?
- Нужно ли мне объявить этот новый контроллер в каком-то существующем файле? Который из? Как?
Найдите хороший файл, откройте его, скопируйте его содержимое, создайте новый файл, вставьте содержимое, удалите бесполезные строки ... Он повторяющийся, подвержен ошибкам и не имеет особой ценности. И это может занять некоторое время. Чаще всего, это часто!
Было бы просто здорово написать `plop` в своем терминале, ответить на 2 вопроса и BIM, все готово!
Именно об этом я и говорю.
Установка
В качестве пакета узла `npm install -g plop`, и вы готовы поиграть с plop.
Вы также можете установить его локально в проект, добавив в зависимости:
npm install --save-dev plop
Затем добавьте его в свои сценарии `package.json`, чтобы вы могли запускать его с помощью `npm run plop`:
{ "name": "your-awesome-project", "description": "This is an awesome project, isn't it?", "dependencies": {}, "devDependencies": { "plop": "1.0.1" }, "scripts": { "plop": "plop" } }
Вуаля!
Конфигурация
Plop использует простой файл `plopfile.js`.
Вот стандартный файл конфигурации, который я предлагаю вам поместить в корень проекта:
module.exports = ( plop ) => { // Here we'll define our generators };
Plop также будет использовать шаблоны, которые можно либо встроить в файл конфигурации, либо поместить в отдельные файлы. Я предлагаю поместить их в папку «plop-templates /«, тоже в корне проекта.
Все включено FTW
Как вы уже догадались: и генератор, и шаблоны встроены в проект, как и ваши тесты или средство выполнения задач (поздний завтрак, глоток, ворчание…).
У этого есть огромные преимущества по сравнению с настраиваемым генератором йоменов:
- единое репо для поддержки всех
- все встроено, нет необходимости устанавливать йомен и генератор для его использования
- обновить шаблон очень просто, вам не нужно публиковать новую версию своего генератора и убедиться, что все обновлены, прежде чем использовать его
Короче говоря, когда генератор Yeoman для конкретного проекта может показаться излишним, шлепок подходит идеально. Легкий, близкий к исходному коду, его будет легче принять, поддерживать и, в конце концов, он будет использоваться.
Наш первый генератор
Для объявления нового генератора `plop` предоставляет вам `setGenerator`:
Подсказки
Часть `подсказки` делегирована Inquirer.js.
Вы можете просто обратиться к их документации, чтобы узнать все, что вы можете сделать - типы вопросов, выходной фильтр, проверка ввода…
Вы можете себе представить, что делаете нетривиальные вещи:
`validate` гарантирует, что данное имя модуля не пустое.
`filter` позволяет стандартизировать вывод: здесь имена модулей должны оканчиваться на `s` по соглашению. Даже если я сделаю это неправильно и укажу `calendar` в качестве имени модуля, я могу быть уверен, что переменная `name` будет` calendars `.
Действия
Теперь он знает все, что ему нужно, plop будет запускать все настроенные вами `actions`. Он может использовать все переменные, которые передал запросчик.
Действия, как и шаблоны, разбираются с помощью Handlebars. Если вы понимаете, как это работает, вы знаете, как использовать plop.
Следовательно, `{{name}}` - это ответ на приглашение, проверенный и отфильтрованный ранее. Вы можете перетащить его где угодно, в созданный путь к файлу и / или его шаблон.
Пока что поддерживается 2 типа действий:
- `” добавить ”`, который создаст новый файл по заданному `пути` - который относительно `plopfile.js`
- «» изменить »«, который изменит файл, расположенный по заданному «пути«. Он заменит RegExp, который вы указали в `pattern`, на предоставленный вами шаблон.
Оба действия могут либо использовать встроенный шаблон через `template`, либо извлекать его из пути, установленного вами через `templateFile`.
Представим себе такую реализацию:
Затем, допустим, у вас есть шаблон plop-templates / model.js `:
Учитывая, что `{{name}}` равно `calendars`, тогда plop создаст следующий `app / modules / calendars.model.js файл:
А также преобразует ваш текущий файл модуля `app / modules / calendars.js`:
Чтобы вставить ссылку на созданную модель:
С помощью «» добавить »« и «» изменить »` вы можете облегчить множество мелких повторяющихся вещей.
Кроме того, вы можете передать функцию в` actions `. Эта функция принимает ответы пользователя в качестве параметра и должна возвращать массив действий, которые необходимо предпринять.
Таким образом вы сможете адаптировать действия к полученным ответам.
Рассмотрим этот пример создания нового модуля:
Ваш генератор может адаптироваться ко многим различным сценариям (например: модуль с моделью, коллекция + модель, с CollectionView или CompositeView…).
Помощники
Небольшое замечание о шаблонных помощниках plop: это те из Handlebars.
Вы начинаете с кучки помощников, которые вам дает шлепок. Например, `camelCase` просто работает следующим образом:
// given name = "my awesome module" {{camelCase name}} // -> `”myAwesomeModule”`.
Вы можете определить свои собственные помощники в `plopfile.js` с помощью `addHelper`:
module.exports = ( plop ) => { plop.addHelper( "upperCase", ( text ) => text.toUpperCase() ); // … };
Мы только что создали помощник `upperCase`, который мы могли бы использовать позже в `действиях` и шаблонах: `{{upperCase name}}`.
Просто используйте это
Вот и все, просто введите npm run plop - или просто plop, если вы сделали его глобальным - затем следуйте инструкциям.
Вы также можете напрямую вызвать конкретный генератор с помощью
npm run plop [generatorName]
Plop быстр и эффективен в использовании, как и Yeoman. Однако он намного легче и проще в обслуживании.
Мой опыт работы с продакшеном
На момент написания я использую шлепок со своей командой по проекту Винога. Его функции идеально подходят для наших сценариев использования.
Я написал генератор Yeoman для этого проекта раньше. Команда конкретно не использовала его.
Определенно, plop - это инструмент, который экономит вам 10 минут здесь и там каждый божий день. И запустив `plop module` в консоли, как это круто \ o /