Rod*_*ney 35 javascript gulp gulp-useref
我正在尝试构建一个gulp管道 - 我想向我注入一些CSS index.html
(这很好),然后从源中获取所有其他链接index.html
并在输出版本中替换它们.
我注意到,如果要替换的模板化部分包含HTML注释,则useref
调用会破坏输出(请参阅下面的示例).用代码演示最简单:COMMENT
index.html
(源文件)<!-- build:css styles/app.css-->
<!--COMMENT-->
<link rel="stylesheet" href="/.tmp/styles.css">
<!-- endbuild -->
Run Code Online (Sandbox Code Playgroud)
gulpfile.js
任务gulp.task('optimizeReplace', function () {
var assets = $.useref.assets({ searchPath: './' });
return gulp
.src('./src/client/index.html')
.pipe(assets)
.pipe(assets.restore())
.pipe($.useref()) //THIS IS THE PROBLEM LINE; IF INJECT IS NOT RUN FIRST IT IS MANGLED
.pipe(gulp.dest('./wwwroot/'));
});
Run Code Online (Sandbox Code Playgroud)
index.html
)</style>
<link rel="stylesheet" href="styles/lib.css">
<link rel="stylesheet" href="styles/app.css-->" <!--COMMENT>
</head>
<body>
<div>
Run Code Online (Sandbox Code Playgroud)
这个问题在HTML中更容易看到,但COMMENT
HTML注释会丢失其标记的结尾部分,因此它之后的所有内容都认为它是一个注释.
我想在替换部分中添加注释的原因是注释实际上是一个gulp-inject语句,它在我执行之前注入了一些其他引用useref
.我将其简化为导致问题的简单HTML注释.
这是导致问题的一行: .pipe($.useref())
仅供参考我正在关注John Papa关于Pluralsight的课程,他使用这种精确机制注入一些CSS然后替换它们 - (inject:css
HTML注释分隔符在a之后被破坏useref
):
<!-- build:css styles/app.css-->
<!-- inject:css -->
<link rel="stylesheet" href="/.tmp/styles.css">
<!-- endinject -->
<!-- endbuild -->
Run Code Online (Sandbox Code Playgroud)
如何useref()
使用正确的链接替换模板,但保留HTML注释完整?
谢谢.
小智 0
评论被删除,但也有例外。IE 条件注释被保留,因此您可以在那里提出请求或编写拉取请求并查看它是否被接受。这是回购协议:
https://github.com/digisfera/useref