Search code examples
javascriptjquerynode.jsderbyjs

Including JS files in Derby.js


I am trying to learn Derby.js and I am having a lot of trouble. I know I can include packages such as jQuery through npm and add it to the node_modules folder, but this isn't quite what I want to do. I want to be able to include these files like I do in normal HTML.

So I want to do something like <Head:> <script src="js/jquery.js"></script>. This does not work though because it cannot find the js directory. I expect this has something to do with the way node.js runs an app and that the app itself will not hold the js directory.

Any help would be appreciated!


Solution

  • Derby offers the Script: tag:

    <Scripts:>
        <script type="text/javascript" src="/components/jquery/jquery.js"></script>
    

    The components directory is because of the usage of bower. Put the components directory into the public directory. According to the express FAQ, the static routes search below the given directory (which is public in derby's example application). Configure bower to put the files under public/components (Choose bower install directory).

    The public directory is configured at lib/server/index.js: .use(gzippo.staticGzip(publicPath, {maxAge: ONE_YEAR})), where publicPath is configured above to path.join(root, 'public').

    Be aware that the "idea behind the inline script is that it runs immediately, before any of the external scripts are loaded. This should only be used in rare cases where the script should run before the page is displayed in the browser, such as sizing something to the window or autofuocusing an element in browsers that don't support the "autofocus" attribute." Nate Smith in the derby google group.

    Inline scripts should be placed in inline.js, located in the same directory as the application's index.js.

    If you require jQuery to do something on the loaded page, following code snipped worked at my side (Firefox, Chrome) in inline.js:

    window.onload = function() {
        alert($(this));
    }