mercuryseries / laravel-elixir-minify-html

Minify the HTML that gets generated by your Blade template files or just static HTML files with Laravel Elixir.

Laravel Elixir HTML minify

This package allows you to minify static HTML files or the HTML that gets generated by your Blade template files. It works very well and is very configurable. It uses gulp-htmlmin, which uses html-minifier.

Installation

First you need to install this package.

npm install --save-dev laravel-elixir-minify-html

Then require this package into your gulpfile.js.

var Elixir = require('laravel-elixir');
require('laravel-elixir-minify-html');

Then call the html method from your mix.

The html method can take up to three arguments:

1. src (required): The files to minify.
2. outputPath (optional): The output folder (defaults to storage/framework/views).
3. options (optional): Options object passed to the gulp-htmlmin task.

This task defines a watcher for the path defined in src.

Sample code:

Elixir(function(mix) {
    mix.html('storage/framework/views/*', 'storage/framework/views/', {collapseWhitespace: true, removeAttributeQuotes: true, removeComments: true, minifyJS: true});
});

laravel-elixir-minify-html's Issues

Not minified

Apparently, nothing changed.

elixir(function(mix) {
    mix.html('storage/framework/views/*');
});

Gulp returns:

[00:50:01] Finished 'copy' after 33 ms
➜  www git:(master) ✗ gulp
[00:50:44] Using gulpfile ~/Dev/OsteApp/www/gulpfile.js
[00:50:44] Starting 'default'...
[00:50:44] Starting 'minify'...
[00:50:44] Finished 'default' after 18 ms
[00:50:44] gulp-notify: [Laravel Elixir] HTML Minified!
[00:50:44] Finished 'minify' after 75 ms

And my views directory didn't change. I have removed all the views and showed the welcome page, before and after the minification, my view didn't change a bit. Actually, only a meta tag was minified in the entire file.

EDIT But strangely, with minifyJS: false it works. Strange because on the 2 existing files, one contains a <script src="..."></script> and the other doesn't contain any script tag

Unhandled 'error' event

Hi there, I saw your elixir extension on laracasts and I wanted to give it a try.

Here is my call:

elixir(function(mix) {
    mix.html('storage/framework/views/*');
});

Here is the output:

➜  www git:(master) ✗ gulp
[19:10:56] Using gulpfile ~/Dev/OsteApp/www/gulpfile.js
[19:10:56] Starting 'default'...
[19:10:56] Starting 'minify'...
[19:10:56] Finished 'default' after 15 ms

events.js:160
      throw er; // Unhandled 'error' event
      ^
Error: Parse Error: <f.childNodes.length;h++){h+=a(f.childNodes[h],k)}}}return n}return this.each(function(){a(this,c)})};jQuery.fn.removeHighlight=function(){return this.find("span.highlight").each(function(){this.parentNode.firstChild.nodeName;with(this.parentNode){replaceChild(this.firstChild,this);normalize()}}).end()};

(function () {
    var search = '  en40cq70jmlb2xy2kc3rqkt939  ';

   if ($('table > tbody > tr').length > 0 && search.length > 1) {
        $('table > tbody > tr').highlight(search);
    }
})();   en40cq70jmlb2xy2kc3rqkt940      en40cq70jmlb2xy2kc3rqkt941      en40cq70jmlb2xy2kc3rqkt942  
    at new HTMLParser (/Users/Max13/Dev/OsteApp/www/node_modules/html-minifier/src/htmlparser.js:236:13)
    at minify (/Users/Max13/Dev/OsteApp/www/node_modules/html-minifier/src/htmlminifier.js:913:3)
    at Object.exports.minify (/Users/Max13/Dev/OsteApp/www/node_modules/html-minifier/src/htmlminifier.js:1262:10)
    at objectAssign.fileName (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/index.js:22:39)
    at module.exports (/Users/Max13/Dev/OsteApp/www/node_modules/tryit/tryit.js:8:9)
    at minifyHtml (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/index.js:21:9)
    at Transform.htmlminTransform [as _transform] (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/index.js:51:7)
    at Transform._read (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/node_modules/readable-stream/lib/_stream_transform.js:159:10)
    at Transform._write (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/node_modules/readable-stream/lib/_stream_transform.js:147:83)
    at doWrite (/Users/Max13/Dev/OsteApp/www/node_modules/gulp-htmlmin/node_modules/readable-stream/lib/_stream_writable.js:319:64)

How can you help me? :)

This does not work for L5.6?

Great work mate! I am trying to use this on L5.6 (mix) and I can not get it to work. I get this:

module.js:559
throw err;
^

Error: Cannot find module 'laravel-elixir'
at Function.Module._resolveFilename (module.js:557:15)
at Function.Module._load (module.js:484:25)
at Module.require (module.js:606:17)
at require (internal/module.js:11:18)
at Object. (/Users/roger/Work/Personal/ags/node_modules/laravel-elixir-minify-html/index.js:2:20)
at Module._compile (module.js:662:30)
at Object.Module._extensions..js (module.js:673:10)
at Module.load (module.js:575:32)
at tryModuleLoad (module.js:515:12)
at Function.Module._load (module.js:507:3)

Minifying in page CSS

I have a page which includes custom CSS in the header which is not getting minified. Also, there seems to be a few issues with <blockquote> and <ul> > <li>. Am I missing something to turn this on?

I've attached a screenshot.

Great package you have, very useful.