/loady

A very simple script loader

Primary LanguageJavaScriptMIT LicenseMIT

Loady v0.2.0

Note: This is still work in progress, so expect it to be a little problematic on certain browsers

What is Loady?

Many script loaders exist in the real world and I'm in no way trying be the "next big thing", as I believe the likes of RequireJS are adequate enough for daily use. I simply created this as a way to further improve my knowledge of JavaScript and experiment with features that I necessarily wouldn't mess around with.

If you're unaware of just what a script loader is, read the links below.

How to use

    <!--Use the minified version for better performance-->
    <script src="dist/loady_es5.min.js"></script>

    <script>
        // An array of strings or a single string can be passed as the first argument.
        // It returns an ES2015 promise which in turn passes the scripts that were either successfully loaded or not
        loady.load(['myScript1.js', 'myScript2.js', 'myScript3'])
        .then(function success(scripts) {
            console.log('Success, the following scripts were loaded into the current document { %o }', scripts);
        })
        .catch(function failed() {
            console.log('An error occurred, though the following scripts were loaded into the current document { %o }', scripts);
        });
    </script>

ES2015

The module is written using ES2015, but is transpiled using babel to ES5. The reason for using babel, is not all browsers currently support the ES2015 specification, though will likely change very soon. The transpiled files are located in the dist directory.

Contribute

To contribute to the project, you will first need to install node globally on your system. Once installation has completed, change the working directory to the module's location and run the following command:

    npm install

After installation of the local modules, you're ready to start contributing to the project. Before you submit your PR, please don't forget to call gulp, which will run against ESlint for any errors, but will also minify the module and transpile using babel.

Watch

Call the following command to start 'watching' for any changes to the main JavaScript file(s). This will automatically invoke ESLint and Uglify.

    gulp watch
ESLint

Call the following command to invoke ESLint and check that the changes meet the requirements set in .eslintrc.

    gulp eslint
Uglify

Call the following command to invoke Uglify, which will minify the main JavaScript file(s) and output to a .min.js file respectively.

    gulp uglify
Build

Call the following command to invoke babel, ESLint and Uglify.

    gulp

Sources

The following sources were used to aid in creating an efficient and readable script loader.