Настройка Polymer с помощью Jekyll?

Я пытаюсь использовать Polymer с сайтом Jekyll, но не могу понять, как все устроить. Я скачал и могу запустить Polymer Starter Kit. Полимер имеет содержание страницы в app каталог, но если я пытаюсь настроить и запустить Jekyll из этой папки, я получаю массу ошибок, потому что Polymer index.html не могу найти ресурсы (потому что корневой каталог другой).

Как правильно настроить и организовать Jekyll и Polymer для совместной работы?

Источник

3 ответа

Решение

Я только что вернулся к этому, и ситуация значительно улучшилась с прошлого лета. Я сделал gulpfile на основе этого для Polymer Starter Kit (1.2.3). Но я изменил поведение default а также serve Задачи для запуска Jekyll обслуживают и встраивают в оболочку:

var spawn = require('child_process').spawn;
var argv = require('yargs').argv;

gulp.task('jekyllbuild', function(done) {
  return spawn('bundle', ['exec', 'jekyll', 'build'], { stdio: 'inherit' })
      .on('close', done);
});

// Build production files, the default task
gulp.task('default', ['clean'], function(cb) {
  // Uncomment 'cache-config' if you are going to use service workers.
  runSequence(
    'jekyllbuild',
    ['ensureFiles', 'copy', 'styles'],
    'elements',
    ['images', 'fonts', 'html'],
    'vulcanize', // 'cache-config',
    cb);
});

gulp.task('serve', function(done) {
  if (argv.port) {
    return spawn('bundle', ['exec', 'jekyll', 'serve', '--port=' + argv.port], { stdio: 'inherit' })
        .on('close', done);
  } else {
    return spawn('bundle', ['exec', 'jekyll', 'serve'], { stdio: 'inherit' })
        .on('close', done);
  }
});

Использование BrowserSync имело бы намного более чистый эффект, но это простой способ получить функциональность Jekyll и выгоду от вулканизации для производства. (Обратите внимание, что вы также должны установить yargs пакет для обработки спецификации порта.) Весь мой gulpfile здесь.

Источник

При чтении полимера начался процесс разработки абзаца readme.md, и вы узнали, что

gulp serve сделан для фазы разработки и gulp Создает приложение, готовое к развертыванию на веб-сервере.

Простое копирование того, что вы скачали с github на веб-сервере, не будет работать as is, так как gulp serve сложнее, чем это. Прочитайте gulpfile.js и вы увидите все, что сделано gulp serve команда.

Вам нужно сделать gulp и тогда вы можете развернуть то, что генерируется в dist папка. Это будет работать на сайте Jekyll.

Источник

Вы можете интегрировать gulp-jekyll в процесс сборки gulp. Я также хотел бы рассмотреть изменения в вашей браузерной синхронизации, чтобы автоматически генерировать HTML-файлы при изменении. Процесс вулканизации должен выполняться только при развертывании.

Источник
Другие вопросы по тегам