Как включить жидкие / глобальные переменные, определенные с помощью Jekyll, в файл Javascript? - PullRequest
Новая
       66

Как включить жидкие / глобальные переменные, определенные с помощью Jekyll, в файл Javascript?

0 голосов
/ 23 октября 2019

В настоящее время я использую Jekyll для создания веб-сайта с уценкой и HTML-файлами. Если я хочу использовать, например, переменные, определенные в папке «_data» в html / md, я могу просто использовать {% для элемента в site.data.XX%}. Мой вопрос: какой правильный синтаксис при достижении переменных Jekyll (например, site) в Javascript?

Я использую frontmatter в своем файле JS. Должен ли я включить что-то туда или сделать импорт?

Я пытался:

  • console.log (site.collections);
  • console.log ({{site.collections}});

Но я просто получаю сообщения об ошибках "Сайт не определен" или "Uncaught SyntaxError: неверный или неожиданный токен".

Ответы [ 3 ]

1 голос
/ 23 октября 2019

Я только что нашел проблему (вы решили ее ранее, Дэвид): Jekyll: жидкостный тег внутри javascript

Кажется, что он печатается правильно (без синтаксических ошибок) при добавлении:

console.log ({{site.collections | jsonify}})

0 голосов
/ 23 октября 2019

Jekyll - генератор статических сайтов, который, по сути, запускается всего один раз . Единственный раз, когда он работает непрерывно, это когда вы вызываете одну из следующих команд: jekyll serve или jekyll build --watch.

С другой стороны, сценарии JavaScript предназначены для запуска при каждом запросе данной страницы. Если сервер с Jekyll не запущен, ваши сценарии не смогут использовать так называемые глобальные переменные.

Однако, тем не менее, вы все равно можете использовать переменные Jekyll для создать статический JS-скрипт. Например, рассмотрим следующее содержание:

./_data/navigation.yml

- label: Home
  url: "/"
- label: About Us
  url: "/about/"

./_includes/script-template.html

<script>
  {% for entry in site.data.navigation %}
    console.log('{{ entry.label }}');
  {% endfor %}
</script>

./test.html

---
---
<body>
  {% include script-template.html %}
</body>

Если вам нужно создать сайт, содержащий указанные выше файлы, сгенерированный HTML-файл ./_site/test.html будет выглядеть следующим образом: 

<body>
  <script>

    console.log('Home');
    console.log('About Us');

  </script>
</body>
0 голосов
/ 23 октября 2019

Любой файл с фронтальной информацией будет обработан jekyll ...

Например: anyfile-with-front-material.js 

---
title: my js file
---
console.log({{page.title}});
console.log({{site.description}});

..., за исключением случаев, когда это " игнорируется ".

По умолчанию:

  • любая подчеркнутая папка игнорируется (например, _myfolder)
  • node_modules, vendor / bundle /, vendor / cache /, vendor / gems / и vendor / ruby ​​/ folder игнорируются конфигурацией по умолчанию

Чтобы сделать содержащиеся файлы доступными для обработки, вы можете добавить содержащиепапки для включения массива в _config.yml . 

include:
 - node_modules
 - _myfolder

Это мое предположение.

...