How to do it...

1. Let's create new files:

      cd && cd workspace
      touch Gruntfile.js package.json

1. Open the package.json file:

      c9 package.json

1. The package file is completely empty, so let's add some code to it:

      {
        "name": "customGrunt",
        "version": "",
        "devDependencies": {
          "grunt": "~1.0.1"
        }
      }

What are we doing in the package.json file? We are giving our package just some key:value pairs. Specifically, we are giving it a name, a version, and devDependencies. Right now, only the devDependency grunt is listed.

1. Now we will add another plugin, grunt-contrib-copy, by typing the following command in our Bash console:

      npm install grunt-contrib-copy --save-dev

Now, we can see that the grunt-contrib-copy plugin has been added to the list of devDependencies in our custom package.json:

      {
        "name": "customGrunt",
        "version": "",
        "devDependencies": {
          "grunt": "~1.0.1",
          "grunt-contrib-copy": "^1.0.0"
        }
      }

More information about this plugin can be found at https://www.npmjs.com/package/grunt-contrib-copy. In a nutshell, this plugin copies files as we specify.

1. Now that we have prepared our package.json file, we can tell Grunt how to use it, by coding Gruntfile.js. We will begin by opening the currently empty Gruntfile.js:

      c9 Gruntfile.js

1. We will add the following code to our Gruntfile.js:

      'use strict';
      module.exports = function (grunt) {
        grunt.initConfig({
          pkg: grunt.file.readJSON('package.json'),

          // Define the copy task
          copy: {
            main: {
              expand: true,
              src: 'dist/css/bootstrap.css',
              dest: 'copy',
            },
          },
        });

        grunt.loadNpmTasks("grunt-contrib-copy");
        grunt.registerTask("default", ['copy']);
      };

1. Finally, it is time to run our default Grunt task, with verbose logging:

      grunt -v

Running the preceding command will create a new folder and will copy the bootstrap.css file in the workspace/copy/dist/css/bootstrap.css

path.

1. Now that we have a basic understanding of just how Grunt runs its tasks, as well as how to modify its tasks to our liking, let's undo the changes we did. However, we will still keep our experimental files, just to have them handy if needed. What follows are the commands used to achieve this. The following commands will get to the root, navigate to /workspace, and make a new folder called GruntExperiment:

      cd; cd workspace; mkdir GruntExperiment

1. Now, let's move our custom Gruntfile.js and package.json files, with the following two commands:

1. Finally, we need to rename our original files to their original names, running the following commands (note that there are two commands here, for two files; each command was split on two rows so they can fit this page width):

      mv node_modules/bootstrap/Gruntfile.jsORIGINAL 
         node_modules/bootstrap/Gruntfile.js;

      mv node_modules/bootstrap/package.jsonORIGINAL 
         node_modules/bootstrap/package.json