Skip to content

Process html files at build time to modify them depending on the release environment

License

Notifications You must be signed in to change notification settings

zebrafishlabs/gulp-processhtml

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

52 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

gulp-processhtml

Gulp plugin uses Denis Ciccale's node-htmlprocessor to process/transform html files.

Travis   npm   License MIT

  • npm: npm install gulp-processhtml --save-dev

Gulpfile

var gulp = require('gulp'),
    processhtml = require('gulp-processhtml')
    opts = { /* plugin options */ };

gulp.task('default', function () {
    return gulp.src('./*.html')
               .pipe(processhtml(opts))
               .pipe(gulp.dest('dist'));
});

Example Usage

You might need to change some attributes in your html, when you're releasing for a different environment.

Using this plugin, you can transform this:

<!DOCTYPE html>
<html>
<head>
  <!-- build:css style.min.css -->
  <link rel="stylesheet" href="css/style.css">
  <!-- /build -->
</head>
<body>

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

  <!-- build:remove -->
  <script src="http://192.168.0.1:35729/livereload.js?snipver=1"></script>
  <!-- /build -->

  <!-- build:replace 'Goodbye Livereload...' -->
  <script src="http://192.168.0.1:35729/livereload.js?snipver=1"></script>
  <!-- /build -->

</body>
</html>

To this:

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="style.min.css">
</head>
<body>
  <script src="app.min.js"></script>
  Goodbye Livereload...
</body>
</html>

Credits

Denis Ciccale

About

Process html files at build time to modify them depending on the release environment

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 77.9%
  • HTML 21.6%
  • CSS 0.5%