Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

404s with comboed urls with Mojito 0.6.1 #46

Closed
JesseZite opened this Issue Jun 17, 2013 · 10 comments

Comments

Projects
None yet
4 participants

Using the latest shaker and mojito using npm causes a problem where not all of the compiled files are being recognized by the /combo~ router.

If certain files like mojito.client[etag].js are in a combo bundle the result will be a 404 even though those files are on disk. Here is my shaker config:

"shaker": {
    "resources": {
        "assets": {
            "js": true,
            "css": true
        },
        "mojito": true,
        "binders": true,
        "models": true,
        "controllers": true,
        "views": true,
        "langs": true
    },
    "tasks": {
        "js": {
            "jsminify": {
                "squeeze": true,
                "mangle": true
            }
        },
        "css": {
            "cssminify": {
                "yuicompress": true
            }
        }
    },
    "locations":{
        "local": true
    },
    "settings": {
        "serveLocation": "local",
        "serveJs": {
            "position": "top",
            "combo": false
        },
        "serveCss": {
            "position": "top",
            "combo": true
        }
    }
}
Collaborator

caridy commented Jun 18, 2013

/ping @aljimenez

Contributor

aljimenez commented Jun 18, 2013

Hello, thanks for reporting this. However I was unable to reproduce the issue. To help me, you can show me the URL that is causing the error, or give me the link to your repository, or you can try to reproduce it using Shaker's sample app

Here is one of the urls that isn't working:

http://test.soljin.com/combo~/static/web-app/assets/compiled/mojito-client.client_986807256341a565aa200683016d90af.js~/static/web-app/assets/compiled/index_2acf5d6e25a9e92413f1574010de2e07.js~/static/web-app/assets/compiled/index_ed0b12b20459704d37d8f584458f47f8.js~/static/web-app/assets/compiled/index_c1758f75bca986ec5865c98dfdd33208.js~/static/web-app/assets/compiled/index_4f3f844182ab1d7b0e70c37f81a49da8.js~/static/web-app/assets/compiled/index_83890c0c250177c8a9de92a9144ddf92.js~/static/web-app/assets/compiled/base.common_9cdfca18d000df2657042b0764dcca70.js~/static/web-app/assets/compiled/log.common_bc7ed138c890713d45274bb1fe515d4e.js~/static/web-app/assets/compiled/index_665f1c2a00e95e119c54f0f39585efab.js~/static/web-app/assets/compiled/index_898a8c72cb12c42063bdf3585ec4d5cd.js

It works fine when I remove these:

~/static/web-app/assets/compiled/mojito-client.client_986807256341a565aa200683016d90af.js
~/static/web-app/assets/compiled/base.common_9cdfca18d000df2657042b0764dcca70.js
~/static/web-app/assets/compiled/log.common_bc7ed138c890713d45274bb1fe515d4e.js

Now works:

http://test.soljin.com/combo~/static/web-app/assets/compiled/index_2acf5d6e25a9e92413f1574010de2e07.js~/static/web-app/assets/compiled/index_ed0b12b20459704d37d8f584458f47f8.js~/static/web-app/assets/compiled/index_c1758f75bca986ec5865c98dfdd33208.js~/static/web-app/assets/compiled/index_4f3f844182ab1d7b0e70c37f81a49da8.js~/static/web-app/assets/compiled/index_83890c0c250177c8a9de92a9144ddf92.js~/static/web-app/assets/compiled/index_665f1c2a00e95e119c54f0f39585efab.js~/static/web-app/assets/compiled/index_898a8c72cb12c42063bdf3585ec4d5cd.js

All of these files do exist on disk. The base.common and the log.common are models in an "appLevel" mojit. And of course the mojito-client is a core mojito file. It appears any appLevel mojito asset or mojito assets aren't getting added to the stati descriptor cache correctly.

Here is my package.js:

{
    "name": "xxxxWeb",
    "description": "xxxx Web",
    "version": "0.0.1",
    "author": {
        "name": "Jesse Foltz",
        "email": "jesse@xxxx.com"
    },
    "contributors": [
          {
              "name": "Jesse Foltz",
              "email": "jesse@xxxx.com"
          }
    ],
    "dependencies": {
        "mojito": "0.6.x",
        "mojito-shaker": "4.0.x",
        "mojito-dot": "*",
        "optimist":"*"
    },
    "engines": {
        "node": ">0.8"
    }
}

Here is my application.js:

[
    {
        "settings": [ "master" ],
        "appPort": "8008",
        "domain":"0.0.0.0",
        "site":{
            "name":"xxxx Web (Alpha)",
            "baseURL":"http://xxx.xxxxx.xxxx.com",
            "fbAdminID":"",
            "fbAppID":"",
            "ogImagePath":"/static/xxxxHeader/assets/img/hibou.png"
        },

        "shaker": {
            "resources": {
                "assets": {
                    "js": true,
                    "css": true
                },
                "mojito": true,
                "binders": true,
                "models": true,
                "controllers": true,
                "views": true,
                "langs": true
            },
            "tasks": {
                "js": {
                    "jsminify": {
                        "squeeze": true,
                        "mangle": true
                    }
                },
                "css": {
                    "cssminify": {
                        "yuicompress": true
                    }
                }
            },
            "locations":{
                "local": true
            },
            "settings": {
                "serveLocation": "local",
                "serveJs": {
                    "position": "top",
                    "combo": false
                },
                "serveCss": {
                    "position": "top",
                    "combo": true
                }
            }
        },

        "specs": {
            "base":{
                "type":"ShakerHTMLFrameMojit",
                "config":{
                    "deploy":true,
                    "title": "xxxx",
                    "child":{
                        "type":"xxxxFrame",
                        "config":{
                            "children":{
                                "headBlob":{
                                    "type":"xxxxHeaderBlob"
                                },
                                "header":{
                                    "type":"xxxxHeader",
                                    "assets": {
                                        "top": {
                                          "css": [
                                              "./css/normalize.css",
                                              "./css/foundation.css",
                                              "./css/base.css"
                                          ],
                                          "js":[
                                              "./js/tk-myriad-pro.js",
                                              "./js/custom.modernizr.js"
                                          ]
                                        }
                                    },
                                    "children":{
                                        "userState":{
                                            "type":"xxxxUserState",
                                            "defer":true
                                        },
                                        "nav":{
                                            "type":"xxxxQuicklistNav"
                                        },
                                        "searchResults":{
                                            "type":"xxxxSearch"
                                        },
                                        "loginModal":{
                                            "type":"xxxxLogin"
                                        },
                                        "exploreModal":{
                                            "type":"xxxxExplore",
                                            "defer":true
                                        }
                                    }
                                },
                                "body":{
                                    "type":"xxxxBodyRouter"
                                }
                            }
                        }
                    }
                }
            }
        },

        "staticHandling": {
            "appName": "web-app"
        }
    },
    {
        "settings": [ "environment:development" ],
        "staticHandling": {
            "forceUpdate": true
        },
        "viewEngine":{
            "cacheTemplates":false
        }
    },
    {
        "settings": [ "environment:production" ],
        "staticHandling": {
            "cache": true
        },
        "viewEngine":{
            "cacheTemplates":true,
            "preloadTemplates":true
        }
    }
]

And here is the server.js, we run it with node server.js -p 80 -e production:

/*jslint anon:true, sloppy:true, nomen:true*/

process.chdir(__dirname);

var cluster = require('cluster'),
    os = require('os'),
    fs = require('fs'),
    optimist = require("optimist"),
    ops = optimist
        .describe(
            "environment",
            "The environment in which the app should be running. "+
            "Should be development, test, or production."
        )
        .describe("port", "The port to bind.")
        .describe("address", "The address to bind.")
        .alias("e", "environment")
        .alias("p", "port")
        .alias("a", "address")
        .alias("h", "help")
        .argv,
    Mojito,
    app,
    pidFile = "nodejs.pid";

if(ops.help){
    console.log(optimist.help());
    process.exit(0);
}


/*
 * Create the MojitoServer instance we'll interact with. Options can be passed
 * using an object with the desired key/value pairs.
 */
Mojito = require('mojito');
app = Mojito.createServer({
    context:{
        environment:ops.environment || process.env.MOJITO_ENV || "development"
    },
    verbose:false,
    port: ops.port || process.env.PORT || '32990',
    address: ops.host || "0.0.0.0"
});


/*
 * Fork the process per CPU core
*/
if(cluster.isMaster){
    /*
     * Write master process pid
    */
    fs.writeFile(pidFile, process.pid + "\n", function(err) {
        if(err) {
            console.log("Failed to write to pid file '" + pidFile + "' : " + err);
        }
    });

    for(var i = 0, ln = os.cpus().length; i < ln; i++){
        cluster.fork();
    }

    cluster.on("exit", function(){
        console.log("Worker died, forking a new one.");
        cluster.fork();
    });
}else{
    app.listen();
}

I don't think it's anything in the Mojits. I've emptied out the spec and loaded an essentially blank page with just the deploy code and was still getting the 404s. I've also tried setting the appLevel mojit back to normal. I also checked the file permissions in the compiled folder all looked good.

Any help would be awesome we are running Mojito 0.5.x right now (the only thing we changed) and it all works great!

Contributor

aljimenez commented Jun 19, 2013

It seems like assets file names with two "." fail to be loaded. I'll have to investigate why; but in the mean time using route rollups would solve this issue since assets would be rolled up into one file and assets such as the mojito-client wont exist individually. The routeRollups configuration is very simple to set up and can improve a site's performance by reducing the number of requests.

Contributor

diervo commented Jun 19, 2013

Mojito discards any file where it cannot match the selector. In this case if you have foo.x.y.css mojito will try to match "x" with a given app selector, if it doesnt find it will not include or reference that file

Sent from my iPhone

On Jun 19, 2013, at 4:21 PM, Albert Jimenez notifications@github.com wrote:

It seems like assets file names with two "." fail to be loaded. I'll have to investigate why; but in the mean time using route rollups would solve this issue since assets would be rolled up into one file and assets such as the mojito-client wont exist individually. The routeRollups configuration is very simple to set up and can improve a site's performance by reducing the number of requests.


Reply to this email directly or view it on GitHub.

Contributor

aljimenez commented Jun 20, 2013

Yea, that is what I thought at first; but this probably doesn't have to do with the resource store or selectors since the problem is during request time. For some reason the new Mojito does not want to serve assets with filenames with two "." even something valid like mojito-client.client.js. Probably has to do with the utility that handles static assets and the way it tries to match the file type though the extension. I am glad you are still looking into Shaker, Diego :)

Contributor

aljimenez commented Jun 20, 2013

Diego you're right, the resource store does discard assets with selectors it doesn't recognize. This is likely the source of the problem and the solution is to simply make sure the compiled assets' basenames do not have a '.'. Not sure if the new Mojito just started enforcing that or if the problem was always there; but thanks for the help!

Contributor

aljimenez commented Jun 20, 2013

mojito-shaker@4.0.24 makes sure that compiled assets do not have selectors.

@aljimenez aljimenez closed this Jun 20, 2013

You guys are really awesome. Thank you so much for fixing that so quickly. Big fan of shaker so far.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment