Passing Page variables as params to js.Build not working as expected

support
1

I have the following snippet (reduced for clarity) in my single template:

{{ $title := .LinkTitle }}
{{ with resources.Get "js/order.js" }}
        {{ $opts := dict "minify" (not hugo.IsDevelopment) "sourceMap" (cond hugo.IsDevelopment "external" "") "params" (dict "title" $title) }}
        {{ with . | js.Build $opts }}
                <script src="{{ .RelPermalink }}"></script>
        {{ end }}
{{ end }}

When I log the passed params, I find that params.title gets a fixed value (probably uses the first value of .LinkTitle as a constant?) and does not vary from Page to Page. While I have often used site variables as params and everything works as expected. But I find that using local (Page) variables as params does not work. Am I using $opts incorrectly?

Thank you

2

You are writing one file.

3

Indeed, I am. But I expect that one file to be different for each Page generated. I am sorry –
What am I missing?

4

You are publishing to the same path each time. There is only one JS file; you’re using the same one for each page.

Do something like:

{{ with resources.Get "js/order.js" }}
  {{ $opts := dict "params" (dict "title" $.LinkTitle) "targetPath" (urls.JoinPath $.RelPermalink "order.js") }}
  {{ with . | js.Build $opts }}
    <script src="{{ .RelPermalink }}"></script>
  {{ end }}
{{ end }}

The published site looks something like this:

public/
├── posts/
│   ├── post-1/
│   │   ├── index.html
│   │   └── order.js
│   ├── post-2/
│   │   ├── index.html
│   │   └── order.js
│   └── index.html
├── favicon.ico
└── index.html

This seems inefficient to me. I’d publish one JS file and grab the title from the DOM.

5

Ahhhhh, DOH! Of course.
Thank you so much for explaining. The key fact I missed was that .RelPermalinkof the built file is the same for every page!!! This familiarity bias that anything called RelPermalink changes from page to page :slight_smile:

I agree - reading it from the DOM would be so much more efficient.