Feature Request: Lazy Dictionary Loading

[zxcvbn-ts]

Feature Request: Lazy Dictionary Loading

[WitteStier]

The lazy loading as documented did not work for me, however the code below do

const loadOptions = async () => {
  const zxcvbnCommonPackage = await import(/* webpackChunkName: "zxcvbnCommonPackage" */ '@zxcvbn-ts/language-common');
  const zxcvbnEnPackage = await import(/* webpackChunkName: "zxcvbnEnPackage" */ '@zxcvbn-ts/language-en');

  return {
    translations: zxcvbnEnPackage.default.translations,
    dictionary: {
      ...zxcvbnCommonPackage.default.dictionary,
      ...zxcvbnEnPackage.default.dictionary,
    },
  };
};

[MrWook]

The dictionaries are not included in the core library anymore. You need to load them by yourself.

We could add an example in the documentation to show how its done.
For example with webpack you could make an async import for lazyloading:

import zxcvbn from '@zxcvbn-ts/core'

const loadOptions = async () => {
  const zxcvbnCommonPackage =  import(/* webpackChunkName: "zxcvbnCommonPackage" */ '@zxcvbn-ts/language-common')
  const zxcvbnEnPackage =  import(/* webpackChunkName: "zxcvbnEnPackage" */ '@zxcvbn-ts/language-en')

  return {
    dictionary: {
      ...zxcvbnCommonPackage.dictionary,
      ...zxcvbnEnPackage.dictionary,
    },
    translations: zxcvbnEnPackage.translations,
  }
}

const password = 'somePassword'
const options = await loadOptions()
zxcvbn(password, options)

I didn't test it but it should do the trick. With CDN's you would just need to change the imports with await fetch('somecdn/zxcvbn-ts/language-someLanguage').

[MrWook]

I looked into it and it seems like there need to be done some changes to the build script to make it work for the browser and CDN approaches.

[MrWook]

Thats true thanks for the report i adjusted it #27

[MrWook]

I will close the issue as it is documented how to lazy load dictionaries.