Following is the sample gruntjs from

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'src/<%= pkg.name %>.js',
        dest: 'build/<%= pkg.name %>.min.js'
      }
    }
  });

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

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

};

It then mentioned:

Because <% %> template strings may reference any config properties, configuration data like filepaths and file lists may be specified this way to reduce repetition.

My question:

1. What does this <%= %> mean? Is it a gruntjs syntax or used universally elsewhere? Where can I find its definition?

2. What's your general approach for searching explanations of cryptic symbols? If I search in google/stackoverflow these strings("<%=", "<%", including quote or not), basically no reasonable results would e up.

Following is the sample gruntjs from http://gruntjs./getting-started

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'src/<%= pkg.name %>.js',
        dest: 'build/<%= pkg.name %>.min.js'
      }
    }
  });

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

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

};

It then mentioned:

Because <% %> template strings may reference any config properties, configuration data like filepaths and file lists may be specified this way to reduce repetition.

My question:

1. What does this <%= %> mean? Is it a gruntjs syntax or used universally elsewhere? Where can I find its definition?

2. What's your general approach for searching explanations of cryptic symbols? If I search in google/stackoverflow these strings("<%=", "<%", including quote or not), basically no reasonable results would e up.

• javascript
• gruntjs
• javascript-objects

• 2 Agreed on #2 above. I had to Google "percent equals grunt" to find this thread. <%= yielded nothing because of how they are used by the search engine. – atconway Commented Jan 17, 2017 at 21:12

1 Answer 1

Have a look at the documentation.

Grunt was around pre-ES2015. That's sort of why they invented their own templating delimiters inside string literals instead of going for proper tagged template strings, which is how you would solve templating nowadays.

The syntax is really just a GruntJS thing, so it's neither universal nor do other projects really use it. Not even all Grunt projects use it, since you can set delimiters yourself.

Basically, it means that config.get will expand these expressions. Inside, you should be able to write anything that is valid JavaScript. Within the delimiters, the grunt object is exposed, which lets you use something like <%=grunt.template.today("yyyy")%> to template the current year, for instance. See also config.get and config.process for the internals.

As for your second question, many times you can write out the symbols as words and enter that in your favorite search engine. And sometimes, you will have an understanding of what these symbols could/should mean in the first place, concept-wise; your question even refers to them as "template strings", a syntactical programming concept, which you could have googled to find the answer.