a beginner's guide to utilizing the grunt target

Here is an example of my Gruntfile.js:

'use strict';

module.exports = function(grunt) {
    grunt.initConfig({
        grunt.config.set('targ', grunt.option('target'));
        cachebuster: {
            build: {
                options: {
                    basedir: 'WebContent',
                    formatter: function(hashes) {
                        var json = {};
                        for (var filename in hashes) {
                            json["/" + filename] = hashes[filename];
                        }
                        return JSON.stringify(json);
                    }
                },
                src: [ 'WebContent/assets/**/*.js', 'WebContent/assets/**/*.css' ],
                dest: 'src/main/resources/cachebusters.json'
            }
        }
    });

// These plugins provide necessary tasks.
grunt.loadNpmTasks('grunt-cachebuster');    

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

};

I am looking to change the destination based on a command line argument of dev or deploy.

For example, if the command line argument is dev, then the destination should be 'cachebuster.json'. If the command line argument is deploy, then the destination should be 'src/main/resources/cachebuster.json'.

How can I accomplish this?

Answer №1

Check out the code blocks below. By default, the first target (dev in this case) will be executed if no arguments are supplied:

cachebuster: {
  dev: {
    options: {
      basedir: 'WebContent',
      formatter: function(hashes) {
        var json = {};
        for (var filename in hashes) {
          json["/" + filename] = hashes[filename];
        }
        return JSON.stringify(json);
      }
    },
    src: ['WebContent/assets/**/*.js', 'WebContent/assets/**/*.css'],
    dest: 'src/main/resources/cachebusters.json'
  },
  deploy: {
    options: {
      basedir: 'WebContent',
      formatter: function(hashes) {
        var json = {};
        for (var filename in hashes) {
          json["/" + filename] = hashes[filename];
        }
        return JSON.stringify(json);
      }
    },
    src: ['WebContent/assets/**/*.js', 'WebContent/assets/**/*.css'],
    dest: 'src/main/resources/cachebusters.json'
  }
}

If you want to share the options across targets, use the code block below:

cachebuster: {
  options: {
    basedir: 'WebContent',
    formatter: function(hashes) {
      var json = {};
      for (var filename in hashes) {
        json["/" + filename] = hashes[filename];
      }
      return JSON.stringify(json);
    }
  },
  dev: {
    src: ['WebContent/assets/**/*.js', 'WebContent/assets/**/*.css'],
    dest: 'src/main/resources/cachebusters.json'
  },
  deploy: {
    src: ['WebContent/assets/**/*.js', 'WebContent/assets/**/*.css'],
    dest: 'src/main/resources/cachebusters.json'
  }
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Maintaining aspect ratio of canvas while ensuring responsiveness

Currently, I am working on a drawing app and have come across an issue that has been challenging for me to resolve. The dilemma lies in resizing the canvas of sketches from the original resolution of 1280 x 720 to the maximum size possible upon opening the ...

Receiving a JavaScript function's output with Python Selenium

Currently, I am in the process of scraping data from a specific webpage. The focus is on extracting the return string value from a Javascript function snippet. The target value to be extracted is indicated as "2227885" https://i.sstatic.net/5dLJ ...

Saving an array to a database in Concrete5

I have created a block where multiple names can be dynamically added. However, when I click save and return to edit the block, the newly added names are not visible. I suspect there is an issue with saving to the database. Can someone please assist me with ...

A more effective method for restricting the properties of a field in an aggregate query

In my MongoDB query, I am attempting to use the aggregate function to fetch data from one collection while limiting the amount of data retrieved from another collection. Here is the code snippet that I have come up with: getFamilyStats: function (req, res ...

What is the best way to modify an Li element using the DOM in JavaScript?

Just the other day, I discovered how to use JavaScript and DOM to add and delete Li elements. Now I'm curious about how to edit those Li elements using DOM. Any suggestions? Thank you! ...

Error: The function 'fetch' is not recognized in Selenium Console

Having some trouble with Selenium and Chrome Developer Tools. I want to open Selenium, go to a URL, and then use driver.execute_script to make a fetch request via Console in Chrome Developer Tools within the Selenium window. However, when I try to run thi ...

The arrangement of a table, an iframe, and another table being showcased in close proximity

I need assistance in aligning a table, an iframe, and another table side by side without any breaks. Ideally, I would like all three elements to be centered on the page. It seems odd that they're not displaying next to each other as my screen is larg ...

ASP.Net & Ajax Fusion Login Interface

I am encountering an issue while creating a login page with HTML, AJAX, and ASP.NET. The data is being passed to the AJAX function successfully, but when I debug the ASP page, the username and password are showing up as NULL. The purpose of the code is to ...

Troubleshooting Tips for Node.js and MongoDB Socket Closure Issue

I'm running into an issue while working on the login system for my NodeJS application. Everytime I attempt to retrieve a collection, MongoDB throws me this unusual error. The Error Message [MongoError: server localhost:27017 sockets closed] name: &a ...

Running `grunt serve` with CORS enabled allows for cross

Our team utilizes grunt serve for live recompiling and reloading of our web application, allowing us to make edits and see changes in almost real-time. The webapp is built using AngularJS, which means that all interactions on the site are done through API ...

Efficiently sending VueJS data to a separate script

I am in the process of transitioning an existing site to VueJS, but I have encountered a roadblock when it comes to finding the best method to accomplish this task. The site currently utilizes D3-Funnel (https://github.com/jakezatecky/d3-funnel) to genera ...

The 'this' variable is malfunctioning when trying to assign a JSONP array to an AngularJS controller

I'm working with a REST service in my angular controller and using JSONP to make the call. I need to store the array that is returned from the service into a variable. This is what I currently have: this.testTheRest = function() { $http.jsonp(&a ...

What is the process for incorporating the 'url-regex' npm package into an Angular(2/4) project?

I'm currently working on a project with Angular 4 and I've run into some issues while trying to use the url-regex package within my Component. After some troubleshooting, I discovered that this approach seems to work: import * as urlRegex from ...

Obtaining JavaScript data using Python Selenium Web Driver

I have been attempting to execute a javascript file within a Python script using Selenium WebDriver in order to retrieve the return value from the function. Despite my efforts and research, I have not been successful after spending several hours on this ta ...

The functionality of the code in a stack snippet may differ from that in a standalone HTML file

My code works perfectly on a stack snippet, but when I insert it into my server or an .html file, the refresh button shrinks! I have copied and pasted the code exactly as it is. Are there any specific snippet features that need to be added for it to work, ...

Ways to convert an asynchronous operation to synchronous in JavaScript

Currently in the process of developing an eslint plugin, I have come across a particular issue. My goal is to implement real-time changes to the configuration file by making an HTTP request to retrieve the JSON configuration. When attempting to execute co ...

NPM Error: File Not Found

After attempting to check global modules, I encountered an ENOENT error. What could be causing this issue and how can it be prevented? https://i.stack.imgur.com/k9GaZ.png ...

Retrieve the Object from the array if the input value is found within a nested Array of objects

Below is the nested array of objects I am currently working with: let arrayOfElements = [ { "username": "a", "attributes": { roles:["Tenant-Hyd"], groups:["InspectorIP", "InspectorFT"] } }, { ...

Prevent links from being clicked multiple times in Rails using Coffeescript

Please make the following link inactive after it has been clicked once <%= link_to "Submit Order", {:action => "charge"}, class: 'btn btn-primary', id: 'confirmButton' %> To permanently deactivate the link, use the code below ...

Searching for ways to retrieve additional information after using the `npm install` command?

While running npm install on my Windows system, I encountered the following warnings: npm WARN install Couldn't install optional dependency: Unsupported npm WARN install Couldn't install optional dependency: Unsupported In previous versions of ...