Javascript Grunt任务：删除HTML文件中标记之间的行

在开发中，我们测试未统一的css文件。在构建时，我们压缩并组合它们。然后，我想删除前两条注释之间未压缩的css

链接

元素，并将

链接

取消注释到生成的

combined.min.css

文件中。任何想法

<!-- __css -->
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/base.css" />
<!-- css__ -->

<!-- __cssmin
<link rel="stylesheet" href="css/combined.min.css" />
cssmin__ -->

---

谢谢

我认为正确的方法是使用两个html文件。一个使用缩小版，另一个使用普通CSS。您可能有index.html，其中包含组合的.min.css和dev.index.html，其中包含其他文件。如果使用grunt更改html，则需要另一种机制来恢复此操作，并将文件保留为原始状态。这再次导致生成两个不同的文件

如果这不起作用，那么您可以创建一个新的自定义grunt任务，该任务读取文件的内容，删除原始css包含，并将其替换为缩小版本：

var fileContent = '\
...\
<!-- __css -->\
<link rel="stylesheet" href="css/reset.css" />\
<link rel="stylesheet" href="css/base.css" />\
<!-- css__ -->\
...\
';

var minified = '<link rel="stylesheet" href="css/combined.min.css" />';
var part1 = fileContent.split("<!-- __css -->");
var part2 = part1[1].split("<!-- css__ -->");
var result = part1[0] + minified + part2[1];
console.log(result);

var fileContent='code>\ ...\ \ \ \ \ ...\ '; var最小化=“”； var part1=fileContent.split（“”）； var part2=part1[1]。拆分（“”）； var结果=第1部分[0]+缩小+第2部分[1]； 控制台日志（结果）； 上述代码生成：

...<link rel="stylesheet" href="css/combined.min.css" />...

。。。。。。

---

jsFIDLE

您没有提到如何进行构建（通常这一切都会像下面的Gruntfile中的默认任务那样组合在一起），但是如果您只需要将单个引用更改为指向缩小文件的单个链接，那么很容易完成工作——请参阅Gruntfile中的replace任务

HTML

乌斯敏
乌斯敏

Gruntfile

module.exports=函数（grunt）{
grunt.initConfig({
pkg:grunt.file.readJSON（'package.json'），
副本：{
地区：{
文件：[{src:'index.html'，dest:'dist/index.html'}]
}
},
“使用MinPrepare”：{
选项：{
目的地：“距离”
},
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'）；
registerTask（'default'，['useminPrepare'，'copy'，'concat'，'cssmin'，'usemin']）；
registerTask（'replace'，['copy'，'usemin'）；
};

结果HTML

乌斯敏
乌斯敏

在构建过程中，我们将文件复制到

dist

目录，因此我们不会处理原始html。我想避免维护两个基本相同的html文件，这正是我想要的。谢谢