Searching Hugo sites with Algolia

tips & tricks
1

We just published a new article in our on-going series called Frontend Friday. Check out how to implement a performant search using Algolia for your site :zap: by Hugo :point_down:. The article is written by @chrisdmacrae

Chris even added some extras to make your algolia searches extra efficient, fast and low-maintenance. Additional credit goes to @budparr for testing Chris’ NPM plugin atomic-algolia.

8 Likes
2

Tested on Windows and throw me an error when npm run algolia

I’m using .env

ALGOLIA_APP_ID={{ xxx }}
ALGOLIA_ADMIN_KEY={{ xxx }}
ALGOLIA_INDEX_NAME={{ xxx }}
ALGOLIA_INDEX_FILE={{ public/algolia.json }}

        if (err) throw err
                 ^

Error: ENOENT: no such file or directory, open 'E:\YUDY\WEB PROJECT\TIA\PROD\mm\{{ public\algolia.json }}'
    at Object.fs.openSync (fs.js:663:18)
    at Object.fs.readFileSync (fs.js:568:33)
    at getIndexFromFile (E:\YUDY\WEB PROJECT\TIA\PROD\mm\node_modules\atomic-algolia\lib\utils\getLocalIndex.js:14:27)
    at getLocalIndex (E:\YUDY\WEB PROJECT\TIA\PROD\mm\node_modules\atomic-algolia\lib\utils\getLocalIndex.js:6:16)
    at update (E:\YUDY\WEB PROJECT\TIA\PROD\mm\node_modules\atomic-algolia\lib\update.js:27:24)
    at Object.<anonymous> (E:\YUDY\WEB PROJECT\TIA\PROD\mm\node_modules\atomic-algolia\lib\index.js:15:5)
    at Module._compile (module.js:660:30)
    at Object.Module._extensions..js (module.js:671:10)
    at Module.load (module.js:573:32)
    at tryModuleLoad (module.js:513:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! yes@1.0.0 algolia: `atomic-algolia`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the yes@1.0.0 algolia script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Yudy\AppData\Local\Webhook\.npm\_logs\2018-03-04T06_37_50_099Z-debug.log

Any idea?
3

Is the error stating {{ public\algolia.json }} or did you do this as a placeholder? if the error states that then the config var is not parsed and should contain the path without {{ }} around. (imho)

I have that article on my todo list and will implement it today or tomorrow and check back if you got yourself sorted out.

1 Like
4

thanks a lot for remind me, newbie mistake :sweat_smile: now npm run algolia works like a charm after get rid the brackets.

another problem is I’m stuck in front-end. <div id="hits">...</div> displaying all in json. it seems that I have to learn how to display search results.

I hope there will be another tips about on how to display and styling the result.

thanks again

5

you overlooked the link in the end of the article: https://community.algolia.com/instantsearch.js/v2/getting-started.html

I’ll be doing that too in the next days, so just open a thread if there are issues. I am nearly done with “creating” my index… brave new world :D.

6

Thanks a lot for the detailed guide! That’s exacly what I need!

7

My .env file should be correct but I still get this error

/home/aedu/Workspaces/web/node_modules/atomic-algolia/lib/index.js:16
    if (err) throw err;
             ^

Error: ENOENT: no such file or directory, open '/home/aedu/Workspaces/web/public/algolia.json'
    at Object.openSync (node:fs:585:3)
    at Object.readFileSync (node:fs:453:35)
    at getIndexFromFile (/home/aedu/Workspaces/web/node_modules/atomic-algolia/lib/utils/getLocalIndex.js:17:25)
    at getLocalIndex (/home/aedu/Workspaces/web/node_modules/atomic-algolia/lib/utils/getLocalIndex.js:9:12)
    at update (/home/aedu/Workspaces/web/node_modules/atomic-algolia/lib/update.js:34:20)
    at Object.<anonymous> (/home/aedu/Workspaces/web/node_modules/atomic-algolia/lib/index.js:13:3)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12) {
  errno: -2,
  syscall: 'open',
  code: 'ENOENT',
  path: '/home/aedu/Workspaces/web/public/algolia.json'
8

Try rebooting your computer.