Grunt concat html and js with different separators?

Question

Currently I am concatenating my Javascript files using grunt and grunt-contrib-concat as follows:

concat: {
    options: {
        separator: ';'
    },
    js: {
        src: [
            '...'
        ],
        dest: 'main.js',
        nonull: true
    }
}

This works great. However I also want to concatenate some HTML files, and do this first.

However if I add a separate task, e.g.

concat: {
    options: {
        separator: ';'
    },
    js: {
        src: [
            '...'
        ],
        dest: 'main.js',
        nonull: true
    },
    html: {
        src: [
            '...'
        ],
        dest: 'partials.html'
    }
}

It will use the same ; separator inbetween each HTML file...

I cannot see anything in the documentation and examples that would help me.

I suppose I could use a separate plugin, maybe something like grunt-html-build but that seems a bit complicated when all I want to do is concatenate them.

I may want to use grunt-contrib-htmlmin or similar afterwards as well, so that is worth bearing in mind.

Is it worth the hassle/overhead just to manually check each script to ensure it ends with a semi-colon?

What is the best way around this?

Answer 1

Why not specify a different separator depending on the target?

grunt.initConfig({
  concat: {
    html: {
      options: {
        separator: " whatever "
      },
      src: []
    },
    js: {
      options: {
        separator: ";\n"
      },
      src: []
    },
  },
});