Search code examples
javascriptgruntjsgrunt-contrib-copy

More efficient way of copying dist files in Grunt?


New to gruntjs and currently using it for moving some npm distributions to a public/js folder.

Here is the code:

module.exports = function(grunt) {

// Project configuration.
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    copy: {
        bootstrapCss: {
            src: "./node_modules/bootstrap/dist/css/bootstrap.css",
            dest: "./public/css/bootstrap.css"
        },
        bootstrapTheme: {
            src: "./node_modules/bootstrap/dist/css/bootstrap-theme.css",
            dest: "./public/css/bootstrap-theme.css"
        },
        bootstrap: {
            src: "./node_modules/bootstrap/dist/js/bootstrap.js",
            dest: "./public/js/libs/bootstrap.js"
        },
        backbone: {
            src: "./node_modules/backbone/backbone.js",
            dest: "./public/js/libs/backbone.js"
        },
        backboneLocalstorage: {
            src: "./node_modules/backbone.localstorage/backbone.localStorage.js",
            dest: "./public/js/libs/backbone.localStorage.js"
        },
        requireJs: {
            src: "./node_modules/requirejs/require.js",
            dest: "./public/js/libs/requirejs.js"
        },
        underscore: {
            src: "./node_modules/underscore/underscore.js",
            dest: "./public/js/libs/underscore.js"
        },
        jquery: {
            src: "./node_modules/jquery/dist/jquery.js",
            dest: "./public/js/libs/jquery.js"
        },
        requireJsText: {
            src: "./node_modules/requirejs-text/text.js",
            dest: "./public/js/libs/requirejs-text.js"
        }
    }



});

// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-copy');

// Default task(s).
grunt.registerTask('default', ['copy']);

};

Is there any way to make this code smaller, rather than have lots of individual copy commands?

Thanks


Solution

  • I would go about this by creating two targets in my copy configuration, one for JS and one for CSS. I would use some of the features provided by Grunt for dynamically building the files object to save me from typing and maintaining each destination path. This way, when I want to add files, I need only add their paths to the respective src array.

    grunt.initConfig({
        copy: {
            js: {
                expand: true,
                cwd: './node_modules',
                dest: './public/js/libs/',
                flatten: true,
                filter: 'isFile',
                src: [
                    './bootstrap/dist/js/bootstrap.js',
                    './backbone/backbone.js',
                    './backbone.localstorage/backbone.localStorage.js',
                    './requirejs/require.js',
                    './underscore/underscore.js',
                    './jquery/dist/jquery.js',
                    './requirejs-text/text.js'
                ]
            },
            css: {
                expand: true,
                cwd: './node_modules',
                dest: './public/css/',
                flatten: true,
                filter: 'isFile',
                src: [
                    './bootstrap/dist/css/bootstrap.css',
                    './bootstrap/dist/css/bootstrap-theme.css'
                ]
            }
        }
    });