Skip to content

ScyLabs/script-loader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 

Repository files navigation

ScriptLoader

ScriptLoader is a Javascript library for async script loading with dependency tree.

Installation

Use the package manager bower to install ScriptLoader.

bower install santanas2b/script-loader

Usage

Load the javascript in your html

<script src="path_to_script_loader_folter/dist/scriptLoader.min.js" type="text/javascript"></script>

Initialize scriptLoader object

var scriptLoader = new ScriptLoader();

Add yours scripts

// add one script
scriptLoader.add({
    src: "https://ajax.googleapis.com/ajax/libs/d3js/5.12.0/d3.min.js"
});
// add many scripts
scriptLoader.add([
    {
        src: "js/custom.js",
        callback: function(){
            // Callback has called when script is loaded
        }
    },
    {
        src: "css/custom.css"
    },
    {
        src: "js/toto.js"
    }
]);

You can add script with requirements

When you add requirements , theys sources loaded before your script.

    scriptLoader.add({
        src: "js/toto.js",
        require: [
            {
                name: "owlCarousel",
                sources: [
                    {
                        src: "css/owl.css",
                        preload: true
                    },
                    {
                        src: "js/owl.js",
                        require: [
                            {
                                name: "jQuery",
                                sources: [
                                    {
                                        src:"https://ajax.googleapis.com/ajax/libs/d3js/5.12.0/d3.min.js"
                                       
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ],
        callback: function(){
            // callback when script loaded
        }
    })

Last step : Launch the load

The Script Loader does a check not to add the same script multiple times. The loader script does not load the same script twice, even if you run the load function multiple times.

The loader script checks that a load is not running when launching the load function, so we can launch it after adding scripts, it will not impact performance.

    scriptLoader.load();

You can tell if the script already exists in the scriptLoader

    // This function return boolean
    scriptLoader.has({
        src: "toto.js"
    });

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT

About

Script Js / Css Async loader

Resources

Stars

Watchers

Forks

Packages

No packages published