Grunt task: Delete lines between markers in an HTML file

Question

In development we test the unminified css files. On build we compress and combine them. I would like to then remove the uncompressed css link elements between the f

Answer 1

You don't mention how you are doing your build (normally this would all be combined like in the default task in the Gruntfile below), but if all you need is to change the individual references to a single link to the minified file it's simple to have grunt-usemin do the work -- see the replace task in the Gruntfile.

HTML

  
  
  
    
    
  


usemin

Gruntfile

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

    copy: {
      dist: {
        files: [ {src: 'index.html', dest: 'dist/index.html'} ]
      }
    },

    'useminPrepare': {
      options: {
        dest: 'dist'
      },
      html: 'index.html'
    },

    usemin: {
      html: ['dist/index.html']
    }
  });

  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-usemin');

  grunt.registerTask('default', ['useminPrepare', 'copy', 'concat', 'cssmin', 'usemin']);
  grunt.registerTask('replace', ['copy', 'usemin']);
};

Resultant HTML

  
  
  


usemin