requirejs config and Gruntfile to use with zurb foundation, Backbonejs and lodash or underscorejs.
Works for foundation 4.0 with requirejs 2.x and grunt 0.4
# for dev
$ npm install
# for production
$ npm install --production
Last active
December 15, 2015 05:29
-
-
Save themouette/5209261 to your computer and use it in GitHub Desktop.
boilerplate for grunt + foundation + backbone + requirejs
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // public/javascripts/config.js | |
| requirejs.config({ | |
| // load foundation and application kernel | |
| deps: ['app/foundation.app', 'app/kernel'], | |
| baseUrl: '/javascripts/', | |
| paths: { | |
| // `vendor` libs are located under `baseUrl`vendor | |
| 'vendor': 'vendor', | |
| // `app` module is located under `baseUrl`src | |
| 'app': 'src', | |
| // `foundation stuff is located under `baseUrl`foundation | |
| 'foundation': 'foundation' | |
| }, | |
| map: { | |
| '*': { | |
| // `vendor/jquery` can either refer to jquery or zepto | |
| 'vendor/jquery': 'vendor/zepto', | |
| // To use lodash instead of underscore | |
| 'vendor/underscore': 'vendor/lodash.underscore' | |
| } | |
| }, | |
| shim: { | |
| 'vendor/backbone': { | |
| //These script dependencies should be loaded before loading | |
| //backbone.js | |
| deps: ['vendor/underscore', 'vendor/jquery'], | |
| //Once loaded, use the global 'Backbone' as the | |
| //module value. | |
| exports: 'Backbone' | |
| }, | |
| 'vendor/lodash.underscore': { | |
| exports: '_' | |
| }, | |
| 'vendor/underscore': { | |
| exports: '_' | |
| }, | |
| 'foundation/foundation.alerts': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.clearing': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.cookie': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.dropdown': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.forms': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.joyride': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation': { | |
| deps: ['vendor/jquery'] | |
| }, | |
| 'foundation/foundation.magellan': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.orbit': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.placeholder': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.reveal': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.section': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.tooltips': { | |
| deps: ['foundation/foundation'] | |
| }, | |
| 'foundation/foundation.topbar': { | |
| deps: ['foundation/foundation'] | |
| } | |
| } | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // public/javascripts/src/foundation.app.js | |
| define([ | |
| 'vendor/jquery', | |
| 'foundation/foundation', | |
| 'foundation/foundation.tooltips', | |
| 'foundation/foundation.reveal', | |
| 'foundation/foundation.forms', | |
| 'foundation/foundation.orbit', | |
| 'foundation/foundation.clearing', | |
| 'foundation/foundation.magellan', | |
| 'foundation/foundation.joyride', | |
| 'foundation/foundation.section', | |
| 'foundation/foundation.alerts', | |
| 'foundation/foundation.placeholder', | |
| 'foundation/foundation.cookie', | |
| 'foundation/foundation.topbar', | |
| 'foundation/foundation.dropdown' | |
| ], function ($) { | |
| $(document).foundation(); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Gruntfile.js | |
| module.exports = function(grunt) { | |
| // Project configuration. | |
| grunt.initConfig({ | |
| pkg: grunt.file.readJSON('package.json'), | |
| concat: { | |
| options: { | |
| separator: ';', | |
| stripBanners: true, | |
| banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' + | |
| '<%= grunt.template.today("yyyy-mm-dd") %> */' | |
| }, | |
| // In dev phase load module asynchronously. | |
| // only concat require and config file. | |
| dev: { | |
| src: ['javascripts/vendor/require.js', 'javascripts/config.js'], | |
| dest: 'build/<%= pkg.name %>.js' | |
| }, | |
| release: { | |
| src: ['javascripts/vendor/almond.js', 'javascripts/config.js'], | |
| dest: 'build/<%= pkg.name %>.js' | |
| } | |
| }, | |
| requirejs: { | |
| main: { | |
| options: { | |
| baseUrl: "/", | |
| mainConfigFile: "javascripts/config.js", | |
| out: "build/<%= pkg.name %>.js" | |
| } | |
| } | |
| }, | |
| compass: { | |
| dist: { // Target | |
| options: { // Target options | |
| sassDir: 'sass', | |
| cssDir: 'css', | |
| environment: 'production' | |
| } | |
| }, | |
| dev: { // Another target | |
| options: { | |
| sassDir: 'sass', | |
| cssDir: 'css' | |
| } | |
| } | |
| }, | |
| uglify: { | |
| options: { | |
| banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n' | |
| }, | |
| build: { | |
| src: 'build/<%= pkg.name %>.js', | |
| dest: 'build/<%= pkg.name %>.js' | |
| } | |
| }, | |
| watch: { | |
| 'script-dev': { | |
| files: ['javascripts/*.js'], | |
| tasks: ['concat:dev'] | |
| }, | |
| 'compass-dev': { | |
| files: ['sass/**/*.scss'], | |
| tasks: ['compass:dev'] | |
| } | |
| } | |
| }); | |
| // Load the plugin that provides the "uglify" task. | |
| grunt.loadNpmTasks('grunt-contrib-uglify'); | |
| grunt.loadNpmTasks('grunt-contrib-concat'); | |
| grunt.loadNpmTasks('grunt-contrib-requirejs'); | |
| grunt.loadNpmTasks('grunt-contrib-compass'); | |
| grunt.loadNpmTasks('grunt-contrib-watch'); | |
| // Default task(s). | |
| grunt.registerTask('dev', ['compass', 'concat:dev']); | |
| grunt.registerTask('release', ['compass', 'require', 'concat:release', 'uglify']); | |
| }; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "your-package-name", | |
| "version": "0.0.1", | |
| "description": "", | |
| "homepage": "", | |
| "author": "Your Name <[email protected]>", | |
| "contributors": [ | |
| { | |
| "name": "Your Name", | |
| "email": "[email protected]", | |
| "url": "" | |
| } | |
| ], | |
| "dependencies": {}, | |
| "devDependencies": { | |
| "grunt": "~0.4.1", | |
| "grunt-contrib-jshint": "~0.1.1", | |
| "grunt-contrib-compass": "~0.1.3", | |
| "grunt-contrib-requirejs": "~0.4.0", | |
| "grunt-contrib-uglify": "~0.2.0", | |
| "grunt-contrib-concat": "~0.1.3", | |
| "grunt-contrib-watch": "~0.3.1" | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment