javascriptgulpnunjucksgulp-nunjucks-render

How to automate functional programing, and avoid repeating myself


Within my gulpfile.js I have the following two functions that are making use of rendering gulp-nun-jucks for 2 different views...


function genNunJucks(cb) {
    return src(paths.views.src)
        .pipe(nunjucksRender({
            path: ['src/views/'], // String or Array
            ext: '.html',
            inheritExtension: false,
            envOptions: {
                watch: true
            },
            manageEnv: manageEnvironment,
            loaders: null
        }))
        .pipe(htmlbeautify({
            indentSize: 2,
            "eol": "\n",
            "indent_level": 0,
            "preserve_newlines": false
        }))
        .pipe(dest(paths.views.dest))
    cb();
}

function genNunJucks2(cb) {
    return src(paths.views.src2)
        .pipe(nunjucksRender({
            path: ['src/views/'], // String or Array
            ext: '.html',
            inheritExtension: false,
            envOptions: {
                watch: true
            },
            manageEnv: manageEnvironment,
            loaders: null
        }))
        .pipe(htmlbeautify({
            indentSize: 2,
            "eol": "\n",
            "indent_level": 0,
            "preserve_newlines": false
        }))
        .pipe(dest(paths.views.dest2))
    cb();
}

When it comes to working within the return area of gulp processes, how can I combine these two functions to be one function that does the same job? You will notice that my path.views.src(x) is the reason I am doing duplicating the process.

Perhaps there is there some kind of lopping process that I can apply that looks through a full array of paths.views.src:['','','']?

Many thanks on any tips


Solution

  • You can make use of closures and a form of currying for this, and create a function that gets src as parameter and returns the genNunJucks that you want to use:

    function createGenNumChunksFunction(src) {
      return function genNunJucks(cb) {
        return src(src)
          .pipe(nunjucksRender({
            path: ['src/views/'], // String or Array
            ext: '.html',
            inheritExtension: false,
            envOptions: {
              watch: true
            },
            manageEnv: manageEnvironment,
            loaders: null
          }))
          .pipe(htmlbeautify({
            indentSize: 2,
            "eol": "\n",
            "indent_level": 0,
            "preserve_newlines": false
          }))
          .pipe(dest(paths.views.dest))
        cb();
      }
    }

    And instead of passing genNunJucks at the place where you use it right now you can pass createGenNumChunksFunction(paths.views.src) and createGenNumChunksFunction(paths.views.src2)

    Here is a simplified version that can be executed in the snipped and illustrates how it works:

    function createGenNumChunksFunction(src) {
      return function genNunJucks() {
        console.log(src)
      }
    }
    
    function callPassedFunction(cb) {
      console.log('function will be called')
      cb();
    }
    
    
    callPassedFunction(createGenNumChunksFunction('src1'))
    callPassedFunction(createGenNumChunksFunction('src2'))

    An additional note - which is probably not relevant for your case - if you want to use the genNunJucks directly without the need to "create" it first, you could keep it outside of the createGenNumChunksFunction.

    function genNunJucks(src) {
      console.log(src)
    }
    
    function createGenNumChunksFunction(src) {
      return function() {
        return genNunJucks(src)
      }
    }
    
    function callPassedFunction(cb) {
      console.log('function will be called')
      cb();
    }
    
    
    callPassedFunction(createGenNumChunksFunction('src1'))
    callPassedFunction(createGenNumChunksFunction('src2'))
    genNunJucks('src3')