Lib Manager

Manage your js vendor dependencies clientside.

Manager that helps us manage js dependencies on the client side. This way we can load libraries when we need, where we need instead of including them in full on page load. Even if they aren’t required for the page to work.

Note: This manager works as a singleton! Every “new” instance created is in fact the same.

Class type: Manager

Dependencies

• EventDispatcher 1.0.0

Getting started

LibManager acts as a thin wrapper around logic that it’ll execute the moment the requested libraries are loaded.

// create lib manager instance with library definitions
const mgr = new LibManager({
    libraries: {

        // self hosted
        selfHostedLib: {
            url: '/libs/self-hosted.js'
        },

        // Using cdn's
        swiper: {
            url: 'https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/js/swiper.min.js',
            css: 'https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/css/swiper.min.css'
        },

        // externals sdk's like google maps
        googleMaps: {
          url:              '//maps.googleapis.com/maps/api/js',
          parameters: {
              key:          '[KEY]',
              libraries:    'places'
          }
        }
    }
});



// init instance with a dependency managed by the maanger
mgr.load('swiper')
    .then( (e) => {
        const swiper = new Swiper(...);

        ...
    })
    .catch( (e) => {
        throw('Error', e)
    })

Constructor Parameters

args

Type: Object Default: {}

Config options that will be used when instance is created

objectName

Type: String Default: 'Component'

Object name that will be used as recognisable identifier and as prefix in logs

Interface

Options

libraries

Type: Object Default: {}

Dictionary of library definitions. Key name will be used to look up and load the requested library when necessary.

Use following parameters to

• url: the url of the javascript library
• css: the url to the css file
• parameters: Url parameters to add to the url of the library (can be ignored if they are already concatenated in the url parameter)

… Event dispatcher options

Properties

version

Type: String Default: [ version number ]

Returns the version number of the class definition

… Event dispatcher properties

Methods

add

Parameters: Object Return: undefined

Add a collection of library definitions

load

Parameters: String or Array Return: Promise

Loads one or multiple libraries depending on the keys given. Promise is run once the given libraries are loaded or have failed.

… Event dispatcher methods

To Do

• Fallback definition in case externally hosted library returns 404
• Change ‘url’ key in library definition to ‘js’