Can't Bundle & Minify JS Assets

support
1

Hello.

With the below code, I’m trying to do JS asset bundling and minification.

{{ $transition := resources.Get "js/transition.js" }}
{{ $zoom := resources.Get "js/zoom.js" }}

 <!--Required by the theme itself-->
{{ $jQuery := resources.Get "js/jquery.js" }}
{{ $bootstrap := resources.Get "js/bootstrap.js" }}

<!--Asset Bundling-->
{{ $jsCombined := $transition $zoom $jQuery $bootstrap | resources.Concat "js/main.js" }}

<!--Asset Minification-->
{{ $js := $jsCombined | resources.Minify }}

<!--JS Injection-->
<script src="{{ $js.RelPermalink }}"></script>

I got the code from the Hugo Docs and therefore can’t see a syntax error but for some reason Hugo server still complains with the following:

<$transition>: can't give argument to non-function $transition

What am I missing? Thanks.

2

Never mind.

I found that I was missing the slice keyword in the combination statement. It was there but during changing my naming schemes, it got deleted accidentally.

Anyways, the following:

{{ $jsCombined := $transition $zoom $jQuery $bootstrap | resources.Concat "js/main.js" }}

should the following instead:

{{ $jsCombined := slice $transition $zoom $jQuery $bootstrap | resources.Concat "js/main.js" }}
3 Likes