Используйте функции непрерывного развертывания Netlify для доставки нашего веб-сайта
Эта статья предназначена для тех, кто хочет настроить рабочий процесс J ekyll + Gulp с Netlify, чтобы использовать бесшовную интеграцию Netlify с GitHub и его функцию непрерывного развертывания (CD).
Всегда можно было настроить рабочий процесс Gulp с помощью Jekyll, а затем вручную развернуть его на Netlify - и есть множество статей, которые помогут вам с этим справиться, - но ручное развертывание обходится без компакт-диска, что, возможно, является лучшей функцией Netlify, позволяющей развертывать запускается быстрым нажатием git.
Здесь мы хотим создать блог Jekyll, который будет полностью оптимизирован - все изображения уменьшены, а таблицы стилей объединены. Gulp должен в значительной степени позаботиться обо всех оптимизациях, но написание простого сообщения в блоге не должно быть обременительной задачей, когда вам придется запускать jekyll build
и gulp build
каждый раз, не говоря уже о хлопотах по установке всех модулей Gulp локально. Это должно быть так же просто, как выполнить простой git push.
Таким образом, мы можем использовать функцию CD Netlify, чтобы позаботиться о создании, оптимизации и развертывании веб-сайта для нас.
Давайте начнем
- Настройте новое репо на Github для проекта и свяжите репо с Netlify.
- Создайте gulpfile.js в корневом каталоге, где мы определим наши задачи Gulp.
- Сделайте
npm init -y
или создайте файл package.json в корневом каталоге.
"build": jekyll build && gulp build
Здесь следует отметить сценарий npm с именем build
, который мы будем использовать для создания нашего веб-сайта в Netlify как часть процесса развертывания. (Двойной амперсанд между обеими задачами должен гарантировать, что задачи выполняются последовательно.)
Две основные задачи, которые необходимо выполнить:
jekyll build
(создает сайт Jekyll внутри каталога_site
)gulp build
(запускает магию Gulp)
Теперь перейдите к Netlify и настройкам сайта для развернутого сайта.
Перейдите на вкладку Build & deploy, чтобы отредактировать команду Build, и используйте сценарий запуска npm, который мы определили ранее.
Это должно делать свое дело. Теперь каждый раз, когда мы выполняем git push
, он должен запускать новое развертывание в Netlify, заботясь о создании нашего веб-сайта, а также о выполнении задач Gulp.
Надеюсь, это поможет. Спасибо за прочтение!