Блог

Более новые версии Hugo предлагают расширенное управление активами JS, даже обработку ресурсов из node_modules, но я этого не понимаю.

Я прочитал документацию и связанные с ней новостные статьи, но мне нужно больше учебника, например, для начала. Или ссылка на репозиторий, где это делается, как и предполагалось, с текущей версией Hugo ( ~ 80 ).

Если для одной страницы вашего сайта требуется three.js скин или другой более крупный импорт JS как вы это делаете? где вы говорите Хьюго импортировать необходимые библиотеки и как/где вы размещаете сценарии, в которых используется библиотека?

Мне кажется, что это неправильно:

• включите ресурсы для всех страниц
• просто добавьте необходимые сценарии cdn в content/section/page.html и используйте его

Это то, что я ищу:

• импортируйте скрипты только в случае необходимости
• используйте предоставленные механизмы для включения и связывания из node_modules
• один файл js для каждой задачи (настройка сцены threejs, инициализация alpinejs, …) каким-то образом привязан к странице или разделу, где это необходимо.
• системный подход, который будет работать с модулями Hugo

если вы просто хотите включить или исключить статический js для определенной страницы, такой как Страница, раздел, Главная страница, вы можете добавить переменные страницы HUgo в свою частичную «footer.html» :

 .IsHome
.IsPage
.IsSection
 

экс :

 {{ .isHome }}
 <script src="home.js">
{{ end }}

{{ .isPage }}
 <script src="page.js">
{{ end }}
 

таким образом, вам не нужно создавать несколько footer.html или вставьте вручную.

более подробно читайте Документ Переменной страницы Хьюго здесь https://gohugo.io/variables/page/

К сожалению, вы не перечисляете то, на что смотрели. Тем не менее, я бы начал (и начал при внедрении систем активов/трубопроводов ХЬЮГО и т. Д.):

1. https://gohugo.io/hugo-pipes/
2. https://gohugo.io/hugo-pipes/js/
3. https://gohugo.io/hugo-pipes/js/#import-js-code-from-assets
4. https://www.regisphilibert.com/blog/2018/07/hugo-pipes-and-asset-processing-pipeline/ С точки зрения сборки ES: импорт { привет } из «мой/модуль»; Это пример, приведенный в 3 выше. Затем, чтобы выборочно использовать, 4 выше дает отличный пример. Пожалуйста, дайте мне знать, если это поможет.