sample frontend config #archive

.editorconfig

# editorconfig.org
root = true

[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false

.gitignore

src/components
node_modules
build
.idea
tmp
incoming
bower_components
build-www
.c9

# cordova related
cordova/platforms
cordova/plugins
cordova/www

config.js

require.config({
    paths: {
        'phaser': 'components/phaser/build/phaser',
//        'phaser': 'components/phaser/build/custom/phaser-arcade-physics',
        'underscore': 'components/underscore/underscore'
    },

    shim: {
        underscore: {
            exports: '_'
        },
        phaser: {
            exports: 'Phaser'
        }
    }
});

require(['one'], function() {
    // let's play a game
});

Gruntfile.js

module.exports = function (grunt) {
    grunt.initConfig({
        clean: {
            // remove build directory and symlink created in src
            build: {
                src: ['src/components', 'build']
            },

            cordova_www: {
                src: ['cordova/www']
            }
        },

        copy: {
            // copy all src changes to build except contents from components symlink as build has it
            src_to_build: {
                cwd: 'src',
                src: ['**', '!components'],
                dest: 'build',
                expand: true
            },

            build_to_www: {
                cwd: 'build',
                src: ['assets/**', '*.html'],
                dest: 'build/www',
                expand: true
            }
        },

        watch: {
            // copy changes from src to build
            copy: {
                files: ['src/**', '!src/components/**'],
                tasks: ['copy:src_to_build']
            },

            livereload: {
                files: [
                    'build/**', '!build/components/**'
                ],
                options: {
                    // run livereload on port 9000 so that we can do port forwarding on chromedevtools to device
                    livereload: 9000
                }
            }
        },

        connect: {
            build: {
                options: {
                    port: process.env.PORT,
                    hostname: process.env.IP,
                    base: 'build'
                    // open: {
                    //     target: 'http://localhost:8000',
                    //     // name of the app that opens, ie: open, start, xdg-open
                    //     appName: 'Google Chrome Canary'
                    // }
                }
            },
            www: {
                options: {
                    port: process.env.PORT,
                    hostname: process.env.IP,
                    base: 'build/www',
                    // open: {
                    //     target: 'http://localhost:8080',
                    //     // name of the app that opens, ie: open, start, xdg-open
                    //     appName: 'Google Chrome Canary'
                    // },
                    keepalive: true
                }
            }
        },

        symlink: {
            buildPhaserExamples: {
                // src: '/Users/kctang/github/phaser-examples',
                // dest: 'build/phaser-examples'
            },

            build_components: {
                src: 'bower_components',
                dest: 'build/components'
            },

            src_components: {
                src: 'bower_components',
                dest: 'src/components'
            },

            www: {
                src: 'build/www',
                dest: 'cordova/www'
            }

        },

        requirejs: {
            compile: {
                options: {
                    baserUrl: 'src',
                    mainConfigFile: 'src/config.js',
                    name: 'components/almond/almond',
                    include: 'config',
                    out: 'build/www/app.js',

                    preserveLicenseComments: false
                }
            }
        },

        'regex-replace': {
            dist: {
                src: 'build/www/index.html',
                actions: [
                    {
                        name: 'replace-requirejs-script-tag',
                        search: '<script data-main="config" src="components/requirejs/require.js"></script>',
                        replace: '<script src="app.js"></script>'
                    },
                    {
                        name: 'remove-livereload-script-tag',
                        search: '<script src=".*livereload.js"></script>',
                        replace: ''
                    }
                ]
            }
        },

        cordovacli: {
            options: {
                path: 'cordova',
                platforms: ['android'],
                plugins: [
                    //'battery-status',
                    //'camera',
                    'console',
                    //'contacts',
                    //'device',
                    //'device-motion',
                    //'device-orientation',
                    //'dialogs',
                    //'file',
                    //'geolocation',
                    //'globalization',
                    //'inappbrowser',
                    //'media',
                    //'media-capture',
                    //'network-information',
                    //'splashscreen',
                    'vibration'
                ]
            },
            create: {
                // should only be used once, to create the Cordova project
                options: {
                    command: 'create',
                    id: 'myapp',
                    name: 'My App'
                }
            },
            add_platforms: {
                options: {
                    command: 'platform',
                    action: 'add'
                }
            },
            add_plugins: {
                options: {
                    command: 'plugin', action: 'add'
                }
            },
            remove_platforms: {
                options: {
                    command: 'platform', action: 'rm'
                }
            },
            remove_plugins: {
                options: {
                    command: 'plugin', action: 'rm'
                }
            },

            build: {
                options: {
                    command: 'build',
                    action: 'android'
                }
            },
            run: {
                options: {
                    command: 'run',
                    action: 'android'
                }
            }
        }

    });

    // load the tasks
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-connect');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-requirejs');
    grunt.loadNpmTasks('grunt-contrib-symlink');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-cordovacli');
    grunt.loadNpmTasks('grunt-regex-replace');


    grunt.registerTask(
        'init',
        ['clean', 'symlink:buildPhaserExamples', 'symlink:build_components', 'symlink:src_components']
    );

    grunt.registerTask('build_src', [
        'init', 'copy:src_to_build'
    ]);

    grunt.registerTask('default',
        ['build_src', 'connect:build', 'watch']
    );

    grunt.registerTask('cordova_create', [
        // create cordova project, add platforms, add plugins, build www project
        'cordovacli:create', 'clean:cordova_www'
    ]);

    grunt.registerTask('build', [
        // process & generate www directory
        'build_src', 'copy:build_to_www', 'requirejs', 'regex-replace', 'symlink:www',

        // process cordova platforms & plugins
        'cordovacli:add_platforms', 'cordovacli:add_plugins',

        // build platform targets
        'cordovacli:build'
    ]);

    grunt.registerTask('serve', [
        'build_src', 'copy:build_to_www', 'requirejs', 'regex-replace', 
        'connect:www'
    ]);

};

index.html

<!doctype html>
<html lang="en">
<head>
    <title>My App</title>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
    <style>
        html, body { height: 100%; margin: 0; padding: 0; background: black}
    </style>

    <script src="http://localhost:9000/livereload.js"></script>
    <script data-main="config" src="components/requirejs/require.js"></script>

</head>
<body>
</body>
</html>