Trouble using the jsBuild params option

Hello, thank you for reading this.

I am having a lot of trouble getting parameters imported into a JS file built with jsBuild. As far as I can tell I am following the documentation as described here.

My head partial looks like this

<head>
...
{{- $recaptchaSiteKey := .Site.Params.GoogleRecaptchaSiteKey -}}
  {{- $opts := dict 
    "targetPath" "main.js" 
    "params" (dict "recaptchaSiteKey" $recaptchaSiteKey) 
  -}}
  {{- $built := resources.Get "javascript/index.js" | js.Build $opts -}}
  <script src="{{ $built.RelPermalink }}" defer></script>
...
</head>

In assets/javascript/index.js I do the following:

import * as params from "@params";

// for debugging
console.log(params.recaptchaSiteKey);
console.log(params);

The output from the above in browser console is as follows:

undefined
{}

When I inspect the outputed main.js file I see that the following is compiled

  // ns-params:@params
  var params_exports = {};
  __export(params_exports, {
    default: () => params_default
  });
  var params_default = {};

The Hugo version I am using is hugo v0.92.2+extended. If there is anything else I can provide to help debug this - please let me know.

Could someone point out what I might be doing wrong?

The params support was added in v0.96.0. I have updated the documentation with that piece of information.

1 Like

Thank you bep! That was my issue.

I also really appreciate you updating the documentation. Thank you for your contributions, I love Hugo so much.

1 Like

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.