使用grunt

Question

我有一个像这样的html块 -

<div class = "logo">
 <a href = "homepage.html"><img src = "logo.png"></a>
 <nav><a href = "#"> Sign In </a></nav>
</div>

我使用grunt自动化我的html模板。我想要的只是，当我运行grunt任务时，它取代

<a href = "homepage.html"><img src = "logo.png"></a>

{{logo}} 这样最终的html就会变成

<div class = "logo">
 {{logo}}
 <nav><a href = "#"> Sign In </a></nav>
</div>

任何类型的帮助将不胜感激。 Thankx。

Answer 1

尝试使用grunt-string-replace，你可以这样做：

'string-replace': {
    logo: {
        files: [{
            src: 'path/to/file.html',
            dest: 'path/to/file.html'
        }],
        options: {
            replacements: [{
                pattern: '<img src = "logo.png">',
                replacement: '{{logo}}'
            }]
        }
    }
}

不要忘记加载NpmTask并运行它：

grunt.loadNpmTasks('grunt-string-replace');
grunt.registerTask('replace', ['string-replace:logo']);

提醒，根据＆＃39; grunt-string-replace＆＃39;文档：

  

使用字符串或正则表达式模式替换文件上的字符串   （......）   grunt-string-replace基本上是String.prototype.replace的包装器，你也可以提供一个函数作为替换模式而不是字符串或模板。