gethyas / hyas Goto Github PK

"lint": "npm run -s lint:scripts && npm run -s lint:styles",

Wording and align UX w/ Hyas website.

Description

I have the following code in my home page to show a YouTube video:

<section class="section section-md section-features">
  <div class="container">
    <div class="ratio ratio-16x9">
      <iframe
        src="https://www.youtube-nocookie.com/embed/0KtiJdZsAnI"
        title="PostOwl in one minute"
        frameborder="0"
        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture;"
        allowfullscreen=""
      ></iframe>
    </div>
  </div>
</section>

This displays a YouTube video as expected in dev mode.

When I build for production and serve the site from public the video isn't visible.

Steps to reproduce

• Install hyas with latest doks theme: npm create hyas@latest -- --template doks
• add the code above somewhere in themes/my-doks-theme/layouts/index.html
• run npm run dev and see the video
• run npm run build and view the output of the public directory using a local web server and the video doesn't display.

Live example

Example deployed on Cloudflare Pages at https://postowl-website.pages.dev/ - inspect and search for iframe and you'll see the code is there and the YouTube player has been downloaded, but it doesn't display.

(There's a warning in the console Error with Permissions-Policy header: Unrecognized feature: 'ch-ua-form-factor' but I believe that's just a warning and can be ignored as described here.)

Expected result

The video should display as it does in dev.

Environment

nodejs 18.16.0 - same resulted in multiple supported environments.
hyas 2.1.0

Remove --minify in package.json:

  "scripts": {
    "start": "hugo server",
    "build": "hugo && npm run build:functions",

Summary

Brief explanation of the feature.

• Prettier

See also:

• hugo-starters/default-template
• hugo-starters/bootstrap-template
• withastro/astro

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Summary

Brief explanation of the feature.

lighthouse https://hyas.netlify.app/ --view

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Set to false in /config/production/config.toml and /config/staging/config.toml:

baseurl = "https://hyas.netlify.com/"
canonifyURLs = false

E.g. for thank you page after form submission:

---
title: "Signed Up"
description: ""
date: 2019-11-22T20:14:45+01:00
draft: false
layout: page
images: [""]
robots: "noindex,noarchive"
feed_exclude: true
sitemap_exclude: true
---

Add custom layouts/rss.xml:

...
    {{ range .Pages }}{{ if ne .Params.feed_exclude true }}
    <item>
      <title>{{ .Title }}</title>
      <link>{{ .Permalink }}</link>
      <pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
      {{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
      <guid>{{ .Permalink }}</guid>
      <description>{{ .Summary | html }}</description>
    </item>
    {{ end }}{{ end }}
  </channel>
</rss>

Summary

Brief explanation of the feature.

--renderToDisk: serve all files from disk (default is from memory)

See also:

• hugo-starters/default-template
• hugo-starters/bootstrap-template
• Hugo Tips: Avoid Crashes With '--renderToDisk'

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Description

NPM scripts do not work on windows due to reference to hugo within node modules
Site runs locally but is broken on netlify (presumably due to headers)

Steps to reproduce

Clone repository.

Remove parts of npm commands before the word hugo to be able to run it, but then browser errors and no external files are run.

Paste the information here as shown by hyas info

Description

Hi again!👋 Starting here again for another site and just wanted to say great work on the updates that've come out in the last several months. I think this is the strongest Hugo starter I've seen.

package.json includes a command for copying KaTeX fonts but I don't see any other references in hyas. Suspect it's leftover from some previous work with Doks.

https://github.com/h-enk/hyas/blob/f43833f825b22323cc6393f26857f80a9bfe8db2/package.json#L40

Expected result

Hyas remains separated from Doks

Summary

https://docs.github.com/en/free-pro-team@latest/github/building-a-strong-community/setting-guidelines-for-repository-contributors

Basic example

https://github.com/github/opensource.guide/blob/HEAD/CONTRIBUTING.md

Motivation

https://opensource.guide/best-practices/#documenting-your-processes

Click to see Hill for issue #38

Click to see Hill for all issues

created by Async

Extend postcss.config.js:

module.exports = {
  plugins: [
    autoprefixer(),
    purgecss({
      content: [
        './layouts/**/*.html',
        './content/**/*.md',      
      ],

I just did a commit to your repo by mistake, I thought I added my new repo, it didn't let me push obviously so I don't think it will do anything but sorry anyway

Add <link rel="shortcut icon" href="/path/to/favicon.ico"> - see also https://support.google.com/webmasters/answer/9290858?hl=en

Summary

Hello! I'm in the middle of migrating a project over to a Hyas starter & workflow and was merging in the Hyas shortcodes which include email.html and img/-simple.html. Shortcodes only work in Markdown and they only transform Markdown, so having used render hooks recently to augment default Markdown rendering while keeping the syntax, I was wondering why these shortcodes should be included/used at all.

Motivation

• Shortcode syntax isn't supported by rich text editors unless you add a custom CMS object or are editing raw md
• When writing shortcode syntax manually it's difficult to remember the parameters and whether they're named or positional
• Render hooks can utilize partials which can be reused in templates and is more DRY (shortcodes can use partials too fwiw)
• You can now create type/section specific hooks for different behaviors, say image treatment/transformation on a blog vs product page
• Do we need to have the img-simple shortcode? What benefit does that bring? It would also be nice to document what the shortcodes (and other templates & code ) are doing in the documentation

Basic example

Here's an example of my render-link.html which utilizes my email.html partial:

{{/* If the link is an email, use the Email partial to utilize email obfuscation. */}}
{{/* Opens external links in a new tab with a noopener ref, and downloadable files like .PDF or .zip (only, for now) */}}

{{- if (strings.HasPrefix .Destination "mailto") -}}
    {{ with .Text}}
        {{ partial "email" (dict "emailAddress" $.Destination "emailTitle" .) }}
    {{ else }}
        {{ partial "email" (dict "emailAddress" $.Destination) }}
    {{ end -}}
{{- else -}}
<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if (or (strings.HasPrefix .Destination "http") (strings.HasSuffix .Destination "pdf") (strings.HasSuffix .Destination "zip")) }} target="_blank" rel="noopener"{{ end }}>{{ .Text | safeHTML }}</a>
{{- end -}}

WIP email.html:

{{/* Encodes emails with JS to protect from bot scrapers. If the text attribute is included (like "Contact Tim") then display that in the anchor, otherwise display the email itself */}}
{{/* {{ partial "email" (dict "emailAddress" "email@address" "emailTitle" "Email Text") }} */}}
{{/* {{ partial "email" (dict "emailAddress" "email@address") }} */}}

{{- $address := replace (.emailAddress | safeURL) "mailto:" "" -}}
<script type="text/javascript">document.write("<a href='mailto:{{ $address }}'>" + "{{ with .emailTitle }}{{ . | safeHTML }}{{else}}{{ $address }}{{end}}" + "</a>");</script><noscript>{{ replace $address "@" " at " }}</noscript>

Summary

{{< img-simple src="google-lighthouse-scores-hyas.png" alt="Google Lighthouse Scores Hyas" >}}

Basic example

{{ $image := .Page.Resources.GetMatch (printf "*%s*" (.Get "src")) -}}
{{ $lqip := $image.Resize $.Site.Params.lqipWidth -}}
<img class="img-simple img-fluid lazyload blur-up" src="{{ $lqip.Permalink }}" data-src="{{ $image.Permalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" {{ with .Get "alt" }}alt="{{.}}"{{ end }}>

Motivation

For inserting small (lt 500px) images where srcset is not relevant

Click to see Hill for issue #37

Click to see Hill for all issues

created by Async

Description

Can not add image in markdown!

Steps to reproduce

1. Create new hyas site
2. insert ![alt](/logo-hyas.png) to any .md file inside content

Expected result

display logo-hyas.png

Actual result

ERROR ... _default_markup\render-image.html::7:18": execute of template failed: template: _default/_markup/render-image.html:7:18: executing "_default/_markup/render-image.html" at <$image.Resize>: nil pointer evaluating resource.Resource.Resize

Environment

{
name: '@hyas/core',
'dist-tags': {
latest: '1.5.5'
},
versions: [
'1.4.3',
'1.4.4',
'1.5.0',
'1.5.1',
'1.5.2',
'1.5.3',
'1.5.4',
'1.5.5'
],
time: {
created: '2021-02-24T12:48:47.290Z',
'1.4.3': '2021-02-24T12:48:47.726Z',
modified: '2022-02-04T10:44:42.902Z',
'1.4.4': '2021-02-25T12:41:04.283Z',
'1.5.0': '2021-06-29T14:25:58.558Z',
'1.5.1': '2021-08-27T08:56:16.465Z',
'1.5.2': '2021-09-21T12:27:58.340Z',
'1.5.3': '2021-11-05T14:56:39.708Z',
'1.5.4': '2022-01-07T13:16:31.604Z',
'1.5.5': '2022-02-04T10:44:41.066Z'
},
maintainers: [
{
name: 'h-enk',
email: '[email protected]'
}
],
description: 'Hyas core',
license: 'MIT',
readmeFilename: 'README.md',
homepage: 'https://github.com/h-enk/hyas#readme',
repository: {
type: 'git',
url: 'git+https://github.com/h-enk/hyas.git'
},
bugs: {
url: 'https://github.com/h-enk/hyas/issues'
},
version: '1.5.5',
browserslist: [
'defaults'
],
publishConfig: {
access: 'public'
},
scripts: {
init: 'shx rm -rf .git && git init -b main',
create: 'exec-bin node_modules/.bin/hugo/hugo new',
prestart: 'npm run clean',
start: 'exec-bin node_modules/.bin/hugo/hugo server --bind=0.0.0.0 --disableFastRender --baseURL=http://localhost',
'start:lan': 'exec-bin node_modules/.bin/hugo/hugo server --bind=0.0.0.0 --baseURL=http://192.168.1.10 --port=1313',
prebuild: 'npm run clean',
build: 'exec-bin node_modules/.bin/hugo/hugo --gc --minify',
'build:lan': 'exec-bin node_modules/.bin/hugo/hugo --gc --minify --baseURL=http://192.168.1.10:8080',
'build:preview': 'npm run build -D -F',
clean: 'shx rm -rf public resources',
'clean:install': 'shx rm -rf package-lock.json node_modules ',
lint: 'npm run -s lint:scripts && npm run -s lint:styles && npm run -s lint:markdown',
'lint:scripts': 'eslint assets/js config functions',
'lint:styles': 'stylelint "assets/scss//.{css,sass,scss,sss,less}"',
'lint:markdown': 'markdownlint-cli2 ".md" "content//.md"',
'lint:markdown-fix': 'markdownlint-cli2-fix ".md" "content/**/.md"',
server: 'exec-bin node_modules/.bin/hugo/hugo server',
test: 'npm run -s lint',
env: 'env',
precheck: 'npm version',
check: 'exec-bin node_modules/.bin/hugo/hugo version',
'latest:hugo': 'gh release view --repo gohugoio/hugo',
'latest:hyas': 'gh release view --repo h-enk/hyas',
'copy:katex-fonts': 'shx cp ./node_modules/katex/dist/fonts/ ./static/fonts/',
postinstall: 'hugo-installer --version otherDependencies.hugo --extended --destination node_modules/.bin/hugo',
version: 'auto-changelog -p && git add CHANGELOG.md'
},
devDependencies: {
'@babel/cli': '^7.17',
'@babel/core': '^7.17',
'@babel/preset-env': '^7.16',
'@fullhuman/postcss-purgecss': '^4.1',
'@popperjs/core': '^2.11',
'auto-changelog': '^2.4',
autoprefixer: '^10.4',
bootstrap: '^5.1',
eslint: '^8.8',
'exec-bin': '^1.0.0',
'hugo-installer': '^3.1',
lazysizes: '^5.3',
'markdownlint-cli2': '^0.4.0',
postcss: '^8.4',
'postcss-cli': '^9.1',
'purgecss-whitelister': '^2.4',
quicklink: '^2.2.0',
shx: '^0.3',
stylelint: '^14.3',
'stylelint-config-standard-scss': '^3.0'
},
otherDependencies: {
hugo: '0.92.1'
},
gitHead: 'ed477efd5354ea463e34ce34679b6e378cf85f40',
dist: {
integrity: 'sha512-05HhNG27nusD1yq5Yff4CsjRaofxDCLmklIdSkTjqreK5shS6dkqOjg+TCF8ReeaRufJqBf8qy8rax7CyWTFgA==',
shasum: 'f38d0cd74ca7f45a73a2f08af144f46635e15f15',
tarball: 'https://registry.npmjs.org/@hyas/core/-/core-1.5.5.tgz',
fileCount: 112,
unpackedSize: 323566,
'npm-signature': '-----BEGIN PGP SIGNATURE-----\r\n' +
'Version: OpenPGP.js v3.0.13\r\n' +
'Comment: https://openpgpjs.org\r\n' +
'\r\n' +
'wsFcBAEBCAAQBQJh/QOZCRA9TVsSAnZWagAAut8P/jwzzrbUE1VeOY43d+XL\n' +
'ipNaGnrvEDB7Z5qDrL/lBtRIYDXJn4Yz831ymKHoOOOv18BsiXU0olPjORzy\n' +
'/C6Fl1Qqxmmg6q6Ae6qs7C36KRBmOesp1HDE5RyKCYz8oNowcHcIp+wTOQkH\n' +
'udkkE6iWjE2KlWIR+9Jw4/8Rj0jHeRefPOPFpNqz0BEdQ+RqDIQjELUezgqf\n' +
'Iuo2j2YFwNwCBhDq6tD2Le4BGoW//O2Gmjth9tUy/3au25gjEo7QI/8hVpdE\n' +
'0D3PHscX0Gd5V7VHWqZMkd3+VAEi2GV1ACUtK/k4vhXmJVj4mFCB4fNLQyIu\n' +
'96QqHLhBIQOdGOPqDrFgM/pLts8Cls+b/0pvT2MJoU5FsofNBwnilBADN8Hd\n' +
'oeuFoIVb1vYyUqytFkRnW+UCrKwfBvtDvAg7Me2wW2kuQ5hMRfJlIxAhVR0I\n' +
'zE5n/ocMhaN5m7LHcuyuinwJ33MLRahwxMwIcTUdoividCW4MVq8EHXd7rtt\n' +
'YOhhb0Z0O8iiBeCELP4nGXsM7f3OUgDNhYTEWCxxqY02xfUf8LABlh1vL1E2\n' +
'n/hdjL3X8Bvn+CfqEkg8t5mgzlx+3kaR4KTeOueOo+SdAjTvxxi15IUgludi\n' +
'A+bl0uFeFw22cLdfLl+hmFxnJTW36Gk3yAaVdGxlEjZCSnF/08Mm4SnmxKKX\n' +
'TVar\r\n' +
'=+id2\r\n' +
'-----END PGP SIGNATURE-----\r\n'
},
directories: {}
}

Add ga-lite as replacement of default GA-script. For perf reasons mainly.

Replace line 4 of layouts/_default/baseof.html w/ <body{{ with .Params.layout }} class="{{ . }}"{{ end }}>

Discussed in #294

{{ define "section" }}
<section class="section container-fluid">
  {{- .Content -}}
</section>
{{ end }}

https://github.com/h-enk/hyas/blob/8135a7ab3833edb6fed739b283d2525898269f43/layouts/partials/head/body-class.html#L10

This is soo small but after pulling in the new updates I discovered a stray - being inserted into the document and traced it back here at the end of this line. It basically throws off the layout of all term pages by pushing everything down a bit.

Also add directories to yarn clean command. Probably organize into vendor folder. Plus update .eslintignore and .stylelintignore.

Summary

Brief explanation of the feature.

https://github.com/h-enk/hyas-images

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Summary

Brief explanation of the feature.

• Add main functionalities as npm modules, like e.g. @hyas/images (5-7 max, to keep it workable)
• Drop hyas-child-theme (no need for it)

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

• Better DRY setup
• Better maintainability
• Easier to update parts /all
• #311

Check

• #212

Description

The configuration parameters bgColor and quality are defined but never used.
Is bgColor intended to set site.webmanifest's background_color property?

Description

Describe the issue that you're seeing.

Steps to reproduce

clone, npm install, npm start
Web Server is available at //localhost:1313/ (bind address 0.0.0.0)

The link is not clickable because http: is missing

Expected result

I have used an older version of hyas and this bug is not present

Actual result

What happened.

Environment

Paste the information here as shown by hyas info

windows

Steps to reproduce

yarn add [some package]

I found it while following this article, adding medium-zoom :
gethyas/doks#545

Description

yarn add command works fine,
but node_modules/gethyas/node_modules/.bin/hugo/* folder disappears after this process
and postinstall command fails.

yarn dev command does not work after this too.

To recover

clean and re-install packages, including node_modules and etc. , resolves the error.

yarn run clean
yarn

Opinion

I think it is better to fix postinstall process/command,
or give specific guide to users who wants to add custom modules to theme.

I'm newbie to Hugo and really like Doks theme. Thanks for reading!

Environment

nodejs: v18.17.1
@hyas/doks-core: 1.0.7
gethyas: 2.2.0

https://discourse.gohugo.io/t/progressive-jpeg-defaults-to-baseline-after-image-processing/21432/4

Summary

Brief explanation of the feature.

• Update Stylelint
• Update ESLint
• Update markdownlint-cli2

See also: hugo-starters/default-template

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Description

The hugo-development team has merged their hugo arm and intel releases into a single universal binary. Project dependency hugo-installer is broken as a result, and It is unclear if the hugo-installer project is still actively maintained.

Steps to reproduce

Bump Hugo to any version above v0.101.0 and run npm install.

Expected result

Specified Hugo version should be fetched and installed.

Actual result

An error is thrown detailing that an appropriate Hugo binary could not be found.

Environment

Checking for existing binary
Downloading binary from "https://github.com/gohugoio/hugo/releases/download/v0.102.0/hugo_extended_0.102.0_macOS-ARM64.tar.gz"
Error: An error occured while trying to download the binary from "https://github.com/gohugoio/hugo/releases/download/v0.102.0/hugo_extended_0.102.0_macOS-ARM64.tar.gz". Details: Response code 404 (Not Found)

Description

since Hyas uses bootstrap 5

/** Bootstrap navbar fix (https://git.io/fADqW) */
is not needed anymore.

Steps to reproduce

Create a hyas site
add bootstrap js to script-footer.html

{{ $bootstrap := resources.Get "js/vendor/bootstrap/dist/js/bootstrap.bundle.min.js" -}} 
{{ $js := slice $bootstrap $lazysizes $app | resources.Concat "main.js" -}}

heeder.html

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <div class="container-fluid">
    <a class="navbar-brand" href="#">Navbar</a>
    <button
      class="navbar-toggler"
      type="button"
      data-bs-toggle="collapse"
      data-bs-target="#navbarNavDropdown"
    >
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNavDropdown">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link active" aria-current="page" href="#">First</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">Second</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

Expected result

There must be a hamburger menu icon on the mobile version of the menu

Actual result

background image removed by _variables.scss file

Solution

I have sent a pull request.

following lines must be removed from the _variables.scss file.

/** Bootstrap navbar fix (https://git.io/fADqW) */
$navbar-dark-toggler-icon-bg: none;
$navbar-light-toggler-icon-bg: none;

Dear Hyas Support Team,

Description

I am experiencing an issue with the Hyas Hugo framework when trying to build with Hugo version 0.123.4. The build process initiates correctly, but eventually fails during the rendering phase, particularly with the execution of templates. The error seems to stem from a potential infinite recursion or timeout in the partial templates, particularly head/head.html and head/stylesheet.html.

Steps to Reproduce

1. Install Hugo version 0.123.4 on a macOS with darwin/arm64 architecture.
2. Set up a new Hyas project or use an existing one.
3. Run the command npm run dev to start the development server.

Unfortunately, I do not have a demo project readily available to link, but the issue occurs with standard Hyas project configurations.

Expected Result

The expected result is a successful build and rendering of pages without any errors, allowing the local development server to run smoothly.

Actual Result

The build process fails with an error message indicating a timeout and potential infinite recursion in the template execution. The specific error messages are:

• ERROR render of "page" failed: execute of template failed: template: _default/single.html: error calling partial: partial "head/head.html" timed out after 30s.
• Error building site: render: failed to render pages: execute of template failed: template: index.html: error calling partial: error calling Permalink: not supported.

Environment

• Hugo Version: 0.123.4
• Extended: Yes
• OS: darwin
• Architecture: arm64
• Build Date: 2024-02-26T16:33:05Z
• Vendor Info: gohugoio

Paste the information here as shown by npm run info

npm run info

[email protected] preinfo
npm version

{
'test-hyas-project': '0.0.0',
npm: '10.4.0',
node: '21.6.1',
acorn: '8.11.3',
ada: '2.7.4',
ares: '1.20.1',
base64: '0.5.1',
brotli: '1.1.0',
cjs_module_lexer: '1.2.2',
cldr: '44.0',
icu: '74.1',
llhttp: '9.1.3',
modules: '120',
napi: '9',
nghttp2: '1.58.0',
nghttp3: '0.7.0',
ngtcp2: '0.8.1',
openssl: '3.0.12+quic',
simdjson: '3.6.3',
simdutf: '4.0.8',
tz: '2023c',
undici: '5.28.2',
unicode: '15.1',
uv: '1.47.0',
uvwasi: '0.0.19',
v8: '11.8.172.17-node.19',
zlib: '1.3.0.1-motley-40e35a7'
}

[email protected] info
npm list

[email protected] /Users/kevin/Sites/test-hyas-project
├── @hyas/[email protected]
├── @hyas/[email protected]
├── @hyas/[email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

[email protected] postinfo
exec-bin node_modules/.bin/hugo/hugo version

hugo v0.123.4-21a41003c4633b142ac565c52da22924dc30637a+extended darwin/arm64 BuildDate=2024-02-26T16:33:05Z VendorInfo=gohugoio

Summary

Automate versioning and CHANGELOG generation, with semver.org and conventionalcommits.org.

Basic example

https://github.com/conventional-changelog/standard-version

Motivation

Making life easier 😃

Click to see Hill for issue #39

Click to see Hill for all issues

created by Async

Summary

Brief explanation of the feature

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Add shelljs + script base, e.g.:

var shell = require('shelljs');

// Copy lazysizes to assets dir
shell.rm('-rf', 'assets/js/lazysizes');
shell.mkdir('-p', 'assets/js/lazysizes');
shell.cp('-R', 'node_modules/lazysizes/lazysizes.min.js', 'assets/js/lazysizes/lazysizes.min.js')

// Copy ga-lite to assets dir
shell.rm('-rf', 'static/js/ga-lite');
shell.mkdir('-p', 'static/js/ga-lite');
shell.cp('-R', 'node_modules/ga-lite/dist/ga-lite.min.js', 'static/js/ga-lite/ga-lite.min.js')

shell.echo('Dependencies copied.');

Description

building fails after update to lates packages...

npm run build

ERROR render of "page" failed: 

execute of template failed: template: blog/single.html:29:11:
 
executing "main" at <partial "picture" (dict "page" . "src" $featured "alt" .Title "class" "img-post-single rounded-0")>

error calling partial: website/node_modules/@hyas/images/layouts/partials/picture.html:233:19

execute of template failed: template: partials/picture.html:233:19
executing "partials/picture.html" at <$l.MediaType>:
can't evaluate field MediaType in type string

I compared the Hyas template /node_modules/@hyas/doks-core/layouts/blog/single.html with my overwriting, and found no differences at this point:

  {{ if site.Params.doks.imageSingle -}}
    {{- $images := .Resources.ByType "image" -}}
    {{- $featured := $images.GetMatch "*feature*" -}}
    {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
    {{- if $featured -}}
      <div class="col-md-13">
        {{ partial "picture" (dict
        "page" .
        "src" $featured
        "alt" .Title
        "class" "img-post-single rounded-0"
        )}}
      </div>
    {{ end -}}
  {{ end -}}

npm info / list

{
  npm: '10.2.4',
  node: '21.5.0',
  acorn: '8.11.2',
  ada: '2.7.4',
  ares: '1.24.0',
  base64: '0.5.1',
  brotli: '1.1.0',
  cjs_module_lexer: '1.2.2',
  cldr: '43.1',
  icu: '73.2',
  llhttp: '9.1.3',
  modules: '120',
  napi: '9',
  nghttp2: '1.58.0',
  openssl: '3.2.0',
  simdjson: '3.6.2',
  simdutf: '4.0.4',
  tz: '2023c',
  undici: '5.28.2',
  unicode: '15.0',
  uv: '1.47.0',
  uvwasi: '0.0.19',
  v8: '11.8.172.17-node.18',
  zlib: '1.2.12'
}

├── @hyas/[email protected]
├── @hyas/[email protected]
├── @hyas/[email protected]
├── @hyas/[email protected]
├── @tabler/[email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

Summary

Integrate ES build and remove js module mounts/concatenation
Add js module imports to js file.

Basic example

powerfulwebdesign.com.au

Motivation

Utilise module imports via esbuild. Remove unnecessary mounts of node modules. Makes it easier for users to add new node.js packages after they look at the source code for hyas.

I can do the coding I have already tested it.

Add to layouts\partials\head\structured-data.html:

{{ $url := replace .Permalink ( printf "%s" .Site.BaseURL) "" -}}
{{ $.Scratch.Add "path" .Site.BaseURL -}}

{{ $.Scratch.Add "breadcrumb" (slice (dict "url" .Site.BaseURL "name" "home" "position" 1 )) -}}
{{ range $index, $element := split $url "/" -}}
  {{ $.Scratch.Add "path" $element -}}
  {{ $.Scratch.Add "path" "/" -}}
    {{ if ne $element "" -}}
      {{ $.Scratch.Add "breadcrumb" (slice (dict "url" ($.Scratch.Get "path") "name" . "position" (add $index 2))) -}}
    {{ end -}}
{{ end -}}

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{{ range $.Scratch.Get "breadcrumb" }}{{ if ne .position 1 }},{{ end }}{
        "@type": "ListItem",
        "position": {{ .position }},
        "item": {
          "@id": "{{ .url }}",
          "name": "{{ .name }}"
        }
    }{{ end }}]
}
</script>

Source: https://gohugohq.com/partials/breadcrumb-partial-with-structured-data-in-hugo/

Summary

Brief explanation of the feature.

See also: gethyas/doks#584 (comment)

• ./layouts/_default/_markup/render-image.html

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Summary

Brief explanation of the feature.

• use unique ID
• fix Cumulative Layout Shift

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Summary

Split dependencies based on whether they are needed for production build (local + netlify) or not.
Configure netlify.toml to NOT install devDependencies for build.

I am happy to help, I am already doing this (on my modified HYAS theme)

Basic example

"devDependencies": {
"@babel/cli": "^7.14",
"@babel/core": "^7.14",
"@babel/preset-env": "^7.14",
"@fullhuman/postcss-purgecss": "^4.0",
"auto-changelog": "^2.3.0",
"autoprefixer": "^10.2",
"bootstrap": "^5.0",
"eslint": "^7.29",
"exec-bin": "^1.0.0",
"hugo-installer": "^3.0.1",
"instant.page": "^5.1",
"lazysizes": "^5.3",
"markdownlint-cli": "^0.27",
"postcss": "^8.3",
"postcss-cli": "^8.3",
"purgecss-whitelister": "^2.4",
"shx": "^0.3.3",
"stylelint": "^13.13",
"stylelint-config-standard": "^22.0"
},

Motivation

Speed up netlify build times,

Summary

Based on https://github.com/h-enk/hyas/blob/master/layouts/_default/_markup/render-image.html

Basic example

Include a basic example or links here.

Motivation

Why are we doing this? What use cases does it support? What is the expected outcome?

Summary

It's generally polite to ask before installing a binary on someones system. It was pretty alarming to have it happen in a postinstall hook. I already had hugo installed. I updated the scripts in package.json to just use hugo and install it if it is required:

"postinfo": "hugo version",
"postinstall": "which hugo || hugo-installer --version otherDependencies.hugo --extended --destination node_modules/.bin/hugo"

and everything works fine except my firewall prompted me to allow hugo to listen on 0.0.0.0. Why does is need to listen on every interface when I am doing local development?

So now, I have the impression that hyas doesn't really pay attention to security and I still haven't figured out what benefit hyas provides over just doing npm init and manually configuring my build pipeline with hugo.