从gulp中删除index.html中的脚本

Question

我在我们的应用程序中使用gulp，我们在Gulpfile.js中有两个流程，一个是生产流程，另一个是开发流程，但我不想保留2个index.html文件，例如index.html和index.dev.html，我想要一个index.html文件，但对于生产构建，我有一些不需要的脚本，例如。

 <!--dev depends -->
    <script src="angular-mocks/angular-mocks.js"></script>
    <script src="server.js"></script>
 <!--dev depends -->

问题是：如何通过Gulp从html中删除某些内容？

- Narek Mamikonyan

Answer 1

您可以使用专门用于此特定目的的 gulp-html-replace 插件：

https://www.npmjs.org/package/gulp-html-replace

- Delapouite

Answer 2

你可以稍微有所不同的方式来处理：将你的index.html模板化，使用gulp-template插件来处理你的构建模板：

var template = require('gulp-template');

//production task 
gulp.task('prod', function () {
    return gulp.src('src/index.html').pipe(template({
        scripts : []
    })).pipe(gulp.dest('dist'));
});


//dev task
gulp.task('prod', function () {
    return gulp.src('src/index.html').pipe(template({
        scripts : ['angular-mocks/angular-mocks.js', 'server.js']
    })).pipe(gulp.dest('dist'));
});

你的index.html可以像下面这样被转换为模板：

<% _.forEach(scripts, function(name) { %><script src="<%- name %>" type="text/javascript"></script><% }); %>

当然，你也可以编写自己的插件/流来从你的index.html中删除脚本，但它需要实际解析/重写index.html。个人认为基于模板的解决方案更容易实现，并且更加“优雅”。

- pkozlowski.opensource

---

你可以稍微调整一下，我相信应该是 it 而不是 is。 - Zanshin13