Question

我的app文件夹中有一个html设置，这是通过gulp复制到dist文件夹中。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../dist/css/style.css">
</head>
<body ng-app="myApp">
<div ui-view></div>

<!-- build:jsLib js/libs.js -->
<script src="../libs/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endbuild -->

<!-- build:jsApp js/app.js -->
<script src="app.js"></script>
<!-- endbuild -->

<script src="../libs/angular-mocks/angular-mocks.js"></script>


<script type="text/javascript">
    angular.module('testApp', ['mockService', 'productServicesApp', 'ngMockE2E']);
</script>

</body>
</html>

该部分用于进行虚假服务调用，我不希望它出现在部署文件中：

//something like *ignore this*
<script type="text/javascript">
        angular.module('testApp', ['mockService', 'productServicesApp', 'ngMockE2E']);
</script>

是否可以忽略这一行与gulp？

Answer 1

是的，这是可能的。一个很好的插件就是gulp-remove-code插件。

以下是如何使用它的示例

<强> HTML：

<div>
  <!--removeIf(production)-->
  <div class="sandbox-banner">Running in sandbox environment</div>
  <!--endRemoveIf(production)-->

  <span>Removing code is ready.</span>
</div>

<强> GULP：

var gulp = require('gulp');
var removeCode = require('gulp-remove-code');

HTML_FILES = '/path/to/html/**/*.html';

gulp.task('clean-html', function() {
  return gulp.src(HTML_FILES)
    .pipe(removeCode({ production: true }))
    .pipe(gulp.dest('dist/'));
});

然后你只需说出

即可

gulp clean-html

这些评论标签内的任何内容都将被删除。此外，传递给removeCode的对象不是特定于命名空间的。因此，您可以将命名更改为任何内容。

是否可以忽略html中使用Gulp构建html中的某些行？

1 个答案: