So verwenden Sie jQuery in einer Grunt-Aufgabe

Question

Ich kopiere einige HTML-Dateien in einer Grunt-Aufgabe, und möchte dann mit jQuery arbeiten - so etwas. . .

copy: { 
    expand: true, 
    src: 'source/*.html', 
    dest: 'build/', 
    ext: '.html', 
    filter: 'isFile', 
    options: { 
     process: function (content, srcpath) { 
     // find all occurrences of <span class='foo'> in file and wrap in a <div class='bah'> 
     $('span.foo').wrap('<div class="bah"></div>'); 
     } 
    } 

Ich sehe es ein Grunzen grunt-jsdom-jquery Plugin ist, dass diese Adresse scheint, aber es wurde zuletzt verpflichtet vor 2 Jahren, und ich kann es nicht an der Arbeit - es scheint, übermäßig ohnehin komplex.

Ich denke, dass ich node jsdom einige wie verwenden muss (und sicherlich hat die Dokumentation ein Beispiel, das jQuery als Skript lädt), aber wie kann ich dies in Grunt und speziell in einer der Hauptaufgaben wie anwenden kopieren oder concat?

Alle Gedanken geschätzt.

Answer 1

Versuchen grunt-processhtml

Es gibt eine method to change blocks of content ist, wo Sie eine Reihe von benutzerdefinierten Blocktypen hinzufügen:

<!-- build:customBlock myValue --> 
<p>This will be replaced with the result of the custom block above</p> 
<!-- /build --> 

Das Ergebnis:

'use strict'; 

module.exports = function (processor) { 
    // This will allow to use this <!-- build:customBlock[:target] <value> --> syntax 
    processor.registerBlockType('customBlock', function (content, block, blockLine, blockContent) { 
    var title = '<h1>' + block.asset + '</h1>'; 
    var result = content.replace(blockLine, title); 

    return result; 
    }); 
}; 

, welche die folgenden in Ihrem HTML wird sich ändern wird sein

<h1>myValue</h1>