Error while using search module #2

sid-r-singh · 2023-09-17T07:55:47Z

sid-r-singh
Sep 17, 2023

I tried to use the search module. But I encountered some error.

What I have tried?

I tried following instructions at https://hugomods.com/en/docs/search/. I don't want a single search page, so I followed the instructions accordingly.

What's the error?

ERROR render of "page" failed: "minimal-bootstrap-hugo-theme\layouts\_default\baseof.html:31:40": execute of template failed: template: posts/single.html:31:40: executing "posts/single.html" at <js.Build>: error calling 
Build: type <nil> not supported in Resource transformations
Error: error building site: TOCSS: failed to transform "scss/main.scss" (text/x-scss): "themes\minimal-bootstrap-hugo-theme\assets\scss\main.scss:2:1": File to import not found or unreadable: search/scss/index.

I guess the module is not getting imported?

My hugo.toml:

[module]
[[modules.imports]]
  path = "github.com/hugomods/search"

[outputs]
  home = ["HTML", "RSS", 'SearchIndex']

I have initialized my repo as a hugo module by running hugo mod init github.com/<user>/<repo>.

My baseof.html:

<!doctype html>
<html lang="en">

{{ partial "head.html" . }}

{{ if .IsHome }}
<body class="home-template notransition" 
data-theme="{{ .Site.Params.defaultColorScheme | default "auto" }}" data-nav="sticky">
{{ else }}
<body class="notransition" 
data-theme="{{ .Site.Params.defaultColorScheme | default "auto" }}" data-nav="sticky">
{{ end }}

  {{ partial "header-logos.html" . }}
  {{ partial "nav.html" . }}
  
  <div class="site-wrap">
    {{ if .IsHome }}
    {{ partial "home-cover.html" . }}
    {{ end }}
    <div class="main">
      
      {{ block "main" . }}{{ end }}

    </div>
    {{ partial "email-subs.html" . }}
    {{ partial "footer.html" . }}
  </div>

  <script src="{{ "js/main.js" | relURL }}"></script>

  {{ $js := resources.Get "main.ts" | js.Build }}
  {{ $searchJS := partial "search/assets/js-resource" . }}
  {{ $js = slice $js $searchJS | resources.Concat "js/main.js" }}
  <script src="{{ $js.RelPermalink }}" defer></script>

</body>

</html>

Answered by razonyang

Sep 17, 2023

Do you have a public repo for reproducing?

According to the logs, it maybe caused by the {{ $js := resources.Get "main.ts" | js.Build }}.
The main.ts is the JS source of the theme/site, when there isn't assets/main.ts in the theme/site, then it fails, so if you're not using Hugo pipes to build the theme's JS, please use the following instead.

{{ partial "search/assets/js" . }}

The code snippet you used is intended to combine the search JS and theme/site JS into one bundle/file to reduce HTTP requests.

I must admit that the docs are unclear, will update the docs later, sorry for the inconvenient.

Btw, similarly, the main.scss is the theme/site's styles file.

View full answer

razonyang · 2023-09-17T09:31:44Z

razonyang
Sep 17, 2023
Maintainer

Hi, I think there is a typo on [[modules.imports]], which should be [[module.imports]]. I will fix the typo of docs.

3 replies

sid-r-singh Sep 17, 2023
Author

Thanks for the reply. You are correct. That got the modules running:

hugo: downloading modules …
go: downloading github.com/hugomods/search v0.4.5
go: added github.com/hugomods/search v0.4.5
go: downloading github.com/krisk/Fuse v6.6.2+incompatible
go: added github.com/krisk/Fuse v6.6.2+incompatible
go: downloading github.com/hugomods/icons v0.6.0
go: added github.com/hugomods/icons v0.6.0
go: downloading github.com/twbs/icons v1.11.0
go: added github.com/twbs/icons v1.11.0

But I still get the following errors:

execute of template failed: template: posts/single.html:32:40: executing "posts/single.html" at <js.Build>: error calling Build: type <nil> not 
supported in Resource transformations
executing "_default/single.html" at <js.Build>: error calling Build: type <nil> not supported in Resource transformations
Built in 696 ms
Error: error building site: TOCSS: failed to transform "scss/main.scss" (text/x-scss): "themes\minimal-bootstrap-hugo-theme\assets\scss\main.scss:2:1": File to import not found or unreadable: search/scss/index.

razonyang Sep 17, 2023
Maintainer

Do you have a public repo for reproducing?

According to the logs, it maybe caused by the {{ $js := resources.Get "main.ts" | js.Build }}.
The main.ts is the JS source of the theme/site, when there isn't assets/main.ts in the theme/site, then it fails, so if you're not using Hugo pipes to build the theme's JS, please use the following instead.

{{ partial "search/assets/js" . }}

The code snippet you used is intended to combine the search JS and theme/site JS into one bundle/file to reduce HTTP requests.

I must admit that the docs are unclear, will update the docs later, sorry for the inconvenient.

Btw, similarly, the main.scss is the theme/site's styles file.

Answer selected by sid-r-singh

sid-r-singh Sep 17, 2023
Author

Do you have a public repo for reproducing?

I'm sorry it is not public.

According to the logs, it maybe caused by the {{ $js := resources.Get "main.ts" | js.Build }}.
The main.ts is the JS source of the theme/site, when there isn't assets/main.ts in the theme/site, then it fails, so if you're not using Hugo pipes to build the theme's JS, please use the following instead.

Using the partial way for loading JS and CSS worked. Thanks.

Also, in the docs, it is mentioned that:

Requirements
Hugo extended version v0.110.0 above.
Hugo Module.
PostCSS, Autoprefixer and RTLCSS, you can install those dependencies via one command npm i postcss-cli autoprefixer rtlcss.

Does one need PostCSS, even after having Hugo extended version?

razonyang · 2023-09-17T12:24:01Z

razonyang
Sep 17, 2023
Maintainer

Does one need PostCSS, even after having Hugo extended version?

Yes, PostCSS CLI is required for building the search styles, since it's not embeded into Hugo releases (if I remember correctly), see https://github.com/hugomods/search/blob/2f052c6c49cc794b2a74bca42def1c06648810a8/layouts/partials/search/assets/css-resource.html#L11C1-L11C1.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

HugoMods

Error while using search module #2

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 2 comments 3 replies

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

Select a reply

HugoMods

Error while using search module #2

sid-r-singh Sep 17, 2023

What I have tried?

What's the error?

Replies: 2 comments · 3 replies

razonyang Sep 17, 2023 Maintainer

sid-r-singh Sep 17, 2023 Author

razonyang Sep 17, 2023 Maintainer

sid-r-singh Sep 17, 2023 Author

razonyang Sep 17, 2023 Maintainer

sid-r-singh
Sep 17, 2023

Replies: 2 comments 3 replies

razonyang
Sep 17, 2023
Maintainer

sid-r-singh Sep 17, 2023
Author

razonyang Sep 17, 2023
Maintainer

sid-r-singh Sep 17, 2023
Author

razonyang
Sep 17, 2023
Maintainer