防止gulp-inline-css将HTML内容包装到html和body标签中
[英]Prevent gulp-inline-css from wrapping HTML content into html and body tags
问题描述
I just want to work on a piece of HTML, which I want to later copy paste as it is and insert into an existing HTML document. 
我只想处理一段HTML，我想稍后再复制粘贴并插入到现有的HTML文档中。 I have something like this: 我有这样的事情：
<div id="someDiv">
</div>
<script src="js/someScript.js" inline></script>
<style>
div#someDiv {
font-weight: bold;
}
</style>
I am using gulp-inline-source to get the script in the built file, I do some basic html minification. 我正在使用gulp-inline-source在构建文件中获取脚本，我做了一些基本的html压缩。 Here is my gulpfile.js: 这是我的gulpfile.js：
var gulp = require('gulp');
var del = require('del');
var jshint = require('gulp-jshint');
var inlinesource = require('gulp-inline-source');
var htmlmin = require('gulp-htmlmin');
var inlineCss = require('gulp-inline-css');
gulp.task('clean', function(cb) {
del(['assets/*'], cb)
});
gulp.task('lint', function() {
return gulp.src('./src/js/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
gulp.task('inlinesource-htmlmin', function() {
return gulp.src('./src/*.html')
.pipe(inlinesource())
.pipe(inlineCss())
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest('./assets'));
});
gulp.task('default', ['clean', 'lint', 'inlinesource-htmlmin']);
It looks like gulp-inline-css is wrapping my content into html and body tags because it does not happen when I comment out the .pipe(inlineCss()) line. 看起来gulp-inline-css会将我的内容包装到html和body标签中，因为当我注释掉.pipe（inlineCss（））行时，它不会发生。
Here is what I get: 这是我得到的：
<html><body><div id="someDiv" style="font-weight: bold"></div><script>$(document).ready(function(){console.log("logging")});</script></body></html>
Any idea how I could prevent that from happening? 知道如何防止这种情况发生吗？
1 个解决方案
解决方案1
1 已采纳 2014-11-27 10:33:28
I ended up using gulp-replace to remove the tags after inlineCss like this: 我最终使用gulp -replace在inlineCss之后删除标签，如下所示：
var gulp = require('gulp');
var del = require('del');
var jshint = require('gulp-jshint');
var inlinesource = require('gulp-inline-source');
var htmlmin = require('gulp-htmlmin');
var inlineCss = require('gulp-inline-css');
var replace = require('gulp-replace')
gulp.task('clean', function(cb) {
del(['assets/*'], cb)
});
gulp.task('lint', function() {
return gulp.src('./src/js/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
gulp.task('inlinesource-htmlmin', function() {
return gulp.src('./src/*.html')
.pipe(inlinesource())
.pipe(inlineCss())
.pipe(replace(/<(html|body)>/g, ''))
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest('./assets'));
});
gulp.task('default', ['clean', 'lint', 'inlinesource-htmlmin']);
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.