How do I implement a Hunspell Dictionary into typo-js?

I'm trying to add Typo Tolerance to a search bar, and I found an npm package called typo-js to help with it. However, it required a Hunspell Dictionary to work, and I haven't been able to find any online resources that explain what that is, or how to implement it in the code. I've included the link to the package below. Any insights on how to resolve this problem would be appreciated.

https://www.jsdelivr.com/package/npm/typo-js

I'm not sure where to find the files it's asking for, or what to do with them once I obtain them.

Upvotes: 0

Views: 811

Answers (1)

danday74
danday74

Reputation: 57231

The answer depends if you are using typo-js clientside (frontend FE) or serverside (backend BE)

Your question suggests FE, so I'll answer accordingly

First, you need an AFF file and a DIC file for your language

For example:

en-gb.aff
en-gb.dic

you can find these files in, for example:

https://www.npmjs.com/package/dictionary-en-gb

(you can use https://unpkg.com to download just these 2 files or you can npm install dictionary-en-gb and copy paste the files from the node_modules folder (and then uninstall it - if you like))

these files should be placed in your public/assets folder so that they can be loaded over HTTP

Finally:

import Typo from 'typo-js'

const dictEnGb: Typo = new Typo('en-gb', null, null, { dictionaryPath: '/assets' 
})

const word = 'corour'

const correct: boolean = dictEnGb.check(word)
const suggestions: string[] = dictEnGb.suggest(word)

console.log(word, correct, suggestions)

Note that typo-js is very fussy where it looks for these files and only the dictionaryPath setting gives a degree of control.

Code annotation states these files will be loaded from:

[settings.dictionaryPath]/dictionaries/[dictionary]/[dictionary].aff [settings.dictionaryPath]/dictionaries/[dictionary]/[dictionary].dic

In this example, the files should be located at:

/assets/dictionaries/en-gb/en-gb.aff
/assets/dictionaries/en-gb/en-gb.dic

If it's not finding the files, keep an eye on your browser's network tab to see where it is trying to load them from (and locate the files accordingly).

Upvotes: 0

Related Questions