react-loadable-library
TypeScript icon, indicating that this package has built-in type declarations

1.0.0 • Public • Published

IMPORTED LIBRARY ✂


imported library

Dont code-split components - code split libraries

Build status

Use the power of renderprop to delived a Library as a React component. Based on React-lodable. Does not support SSR and React Suspense. Use react-imported-library if you are looking for them.

  • ⛅️ You can codesplit momentjs, you may async load any library and use it.
  • 🔒 Written in TypeScript.

Usage

Have you heard, than moment.js is super hudge? Code split it!

import {importedLibrary, importedLibraryDefault, setConfig} from 'react-loadable-library';
 
// do you need SSR support? Probably not (affect react-imported-component settings)
setConfig({SSR: false});
 
// this will import `default` export
const Moment = importedLibraryDefault( () => import('momentjs'));
 
<Moment>
 { (momentjs) => <span> {momentjs(date).format(FORMAT)}
</Moment>

May be you have a small library, you may use somewhere inside your components?

Codesplit it!

import {importedLibrary} from 'react-loadable-library';
const Utils = importedLibrary( () => import('./utils.js'));
 
<Utils>
 { ({a,b,}) => <span> {a(b+c())}
</Utils>

May be you also have to caclucate something heavy, not to do it on every render?

// you may use "initialization hook" to offload some computations
 
<Utils
  initial={ ({a,b,c}) => ({ result: a(b+c()) })}
>
 {(_,state) => <span>{state.result}</span>} 
</Utils>
 
 

API

  • importedLibrary(importer, options?): Component

    • importer is an import statement, or any Promise resolver
    • options
      • options.async:boolean - enables React.suspense, ie throws a Promise on loading
      • options.exportPicker - allows you to "pick" export from the original file
  • importedLibraryDefault - is just importedLibrary with exportPicker configured to pick .default

  • Component

    • initial: (library: T) => K; - state initializator
    • children: (library: T, state: K) => React.ReactNode - function-as-children
    • error: ReactComponent - error indicator
    • loading: ReactComponent - unthrottled loading indicator.

Licence

MIT

Package Sidebar

Install

npm i react-loadable-library

Weekly Downloads

1

Version

1.0.0

License

MIT

Unpacked Size

9.13 kB

Total Files

7

Last publish

Collaborators

  • kashey