-Использование рулей-помощников с экспресс-генератором
Зарядите свой проект Express / Handlebars с помощью помощников по рулям
Один из моих любимых движков просмотра - Handlebars. Использовать Handlebars с NodeJS довольно просто, особенно с Express Generator. Но сам Handlebars довольно ограничен и прост. Handlebars Helpers добавляет 188 дополнительных помощников, что значительно упрощает создание шаблонов с помощью Handlebars.
1. Создайте приложение Express с помощью Express Generator.
Установите Express Generator глобально, используя
npm i -g express-generator
Используйте Express Generator для создания приложения Express с помощью этой команды:
express someAppName --view=hbs
Это создает базовое приложение Express с поддержкой Handlebars. someAppName
- это пример имени проекта. Вы можете использовать собственное название проекта. Express Generator создает папку с названием проекта и генерирует все необходимые файлы.
Перейдите в папку проекта и установите рули-хелперы и экспресс-рули.
npm install --save handlebars-helpers express-handlebars
2. Импортные рули-хелперы и экспресс-рули.
В нашем app.js
файле импортируем рули-хелперы и экспресс-рули. Создайте экземпляр помощников.
const hbs = require('express-handlebars'); const hbshelpers = require('handlebars-helpers'); const multihelpers = hbshelpers();
Закомментируйте настройку движка просмотра по умолчанию и добавьте следующие коды:
//Commment out => app.set('views', path.join(__dirname, 'views')); app.engine( "hbs", hbs({ helpers: multihelpers, partialsDir: ["views/partials"], extname: ".hbs", layoutsDir: "views", defaultLayout: "layout" }) );
Полный пример app.js:
3. Тестовые рули-помощники
Теперь для тестирования мы можем использовать индексный маршрут. Просто передайте переменную в представление, и мы будем использовать ее для условного рендеринга некоторого HTML с помощью handlebars-helpers. Отредактируйте файл маршрута индекса в /routes/index.js
.
Например, мы можем использовать помощник is
. Этот помощник принимает два аргумента, и если эти два аргумента равны, блок будет отрисован.
{{#is someVariable 'example'}} THIS WILL BE RENDERED {{/is}}
В /views/index.hbs
наш код теперь должен выглядеть так
Вот и все! Теперь вы можете использовать рули-помощники с Express Generator! Для получения дополнительных помощников посетите здесь.