hotReloadHandler

hotReloadHandler.js

define([
        'socketio',
        '#allCollections',
        '#allCSS',
        '#hotReload',
        'app/js/cssAdder'
    ],

    function (io, collections, allCSS, hotReload, cssAdder) {


        var socketHotReload = null;

        function getConnection() {

            if (socketHotReload == null) {

                socketHotReload = io.connect('http://127.0.0.1:3002');

                //you should implement io.on 'error', on 'connect' and on 'disconnect' etc

                socketHotReload.on('.jsx transform error', function (data) {
                    throw new Error(data)); //you need to implement window.onerror to prevent error from crashing front-end and to let yourself know why the transform failed
                });


                socketHotReload.on('hot-reload (.jsx)', function (data) {

                    hotReload.hotReloadSimple(data,function(err,result){

                        if(err){
                            alert(err);
                            return;
                        }

                        var filename = reconcilePath(data); //you need to implement reconcilePath

                        require(['#allViews'],function(allViews){ //I have a module '#allViews' that contains all my front-end views
                            allViews[filename] = result;
                            Backbone.history.loadUrl(Backbone.history.fragment); //reload the current page (don't need to worry about any other pages)
                        });
                    });
                });

            }

            return socketHotReload;
        }

        return {
            getConnection: getConnection,
        };
    });