GithubHelp home page GithubHelp logo

minimize's People

Contributors

chiefcll avatar dskrepps avatar foru17 avatar greenkeeper[bot] avatar manland avatar marcbachmann avatar medanat avatar pisandelli avatar sanfords avatar sfarthin avatar swaagie avatar tombyrer avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

minimize's Issues

Tag <code>

Tag "code" shouldn't be minimyzed, bcs it retain chars like "\s","\n".

comments and conditionals are not treated differently

Keeping one true is the same as keeping the other, or both, true (i.e. {comments: true} == {conditions: true}).

I know this was done on purpose to clean up the comments logic, but it seems like a punt. Can we go back to treating these two different?

helpers has no method 'style'

When minifying an .html file with a <style> tag, we receive the following exception:
TypeError: Object # has no method 'style'

Handlebars helper in <option> tag for selected attribute

I'm having an issue minimizing an Handlebars template.

<option {{#ifCond this.key ../model.preset}}selected{{/ifCond}}>
  {{this.key}}
</option>

get's minimized as:

<option {{#ifcond="" this.key="" ..="" model.preset}}selected{{="" ifcond}}="">{{this.key}}</option>

It seems like minimize is trying to minimize my Handlebars template into xHTML compliant markup. If I put my Handlebars helper directly in an element attribute (between the quotes), it will get minimized just fine, see example below.

Source HTML

<!-- this works just fine! -->
<div class="{{#ifCond model.is_available false}}disabled{{/ifCond}}"></div>

<!-- bad! minimize hates on badly formatted HTML I guess -->
<div {{#ifCond model.is_available false}}class="disabled"{{/ifCond}}></div>

Minimized HTML (formatted for readability):

<!-- good! -->
<div class="{{#ifCond model.is_available false}}disabled{{/ifCond}}"></div>

<!-- bad -->
<div {{#ifcond="" model.is_available="" false}}class="disabled" {{="" ifcond}}=""></div>

It is easy to fix the example just above, however, I am not sure how to deal with the selected attribute. Is there a way to indicate to minimize not to parse some HTML ?

Thanks!

Mishandling Underscore/LoDash Template Strings

Looks like minimize is interpreting Underscore template strings as HTML elements.

Example:

Original

<h1>
  <%= myTitle %>
</h1>

Minified

<h1><%= mytitle %></%=></h1>

It would be nice if it recognized these template strings and didn't attempt to either close the tag or transform the placeholder to lowercase.

Minifier stripping double-quotes on script tag

I'm trying to minify all of my template files that have been precompiled. Each has a script tag surrounding the processed template. When I use gulp-minify-html on the following processed template, the script tags attributes loose their double quotes and the html is no longer valid:

Original file:

<script id="tpl_Dreamscape.handlebars" type="text/x-handlebars-template">
<div class="another" id="DreamscapeMyIDHere" >
        <div id="itemNumberSec1" tabindex="0" class="porthole One" style="background:#003344">Sec1</div>
        <div id="itemNumberSec2" tabindex="0" class="porthole Two" style="background:#FF0033">Sec2</div>
        <div id="itemNumberSec3" tabindex="0" class="porthole Three" style="background:#999999">Sec3</div>
        <div id="itemNumberSec4" tabindex="0" class="porthole Four" style="background:rgb(255,0,255)">Sec4</div>
</div>
</script>

Result:

<script id=tpl_Dreamscape.handlebars type=text/x-handlebars-template><div class="another" id="DreamscapeMyIDHere" > <div id="itemNumberSec1" tabindex="0" class="porthole One" style="background:#003344">Sec1</div> <div id="itemNumberSec2" tabindex="0" class="porthole Two" style="background:#FF0033">Sec2</div> <div id="itemNumberSec3" tabindex="0" class="porthole Three" style="background:#999999">Sec3</div> <div id="itemNumberSec4" tabindex="0" class="porthole Four" style="background:rgb(255,0,255)">Sec4</div> </div></script>

Usage:

return gulp.src( 'build/min-templates/*.handlebars' )
                .pipe(minifyHTML()).pipe(gulp.dest('build/min-templates/'));

Boolean attributes should only be considered as such on elements that define them

With spare: false minimize drops the value of what it considers boolean attributes no matter the element. It should treat boolean attributes as such only on elements that define them.

For example, the test at https://github.com/Moveo/minimize/blob/3c595799006f02ce256f775da9c42a99e6af9aa2/test/minimize-test.js#L136, which checks that attribute disabled is not removed on element h4, should actually not depend on the value of spare option at all, since h4 does not define attribute disabled.

Apostrophes in attributes

Attribute
<div data-vars='{"form": "blablabla"}'></div>
after processing will come to
<div data-vars="{"form": "blablabla"}"></div>

Better explanation of how plugins work

Hi, I wanted to try and use a plugin to "skip" certain elements. Specifically, elements that might later on be changed by server-side rendered code.

For example, I use ejs in Express so my error page has an element <%= error %> that I want to ignore during minimize. I have the following plugin:

  plugins: [{
      id: 'ejs',
      element: function element(node, next) {
        if (node.name === '%=') {
          // Ignore further processing
        }
        next();
      }
    }]

That can detect the elements, but there doesn't seem to be a way to say "skip ahead and don't process these"

Problem with SVG

I'm experiencing an issue when minimizing svg markup, I'm using the gulp-minify-html plugin which makes use of minimize, I initially reported it to that developer but he pointed me in your direction

https://github.com/jonathanepollack/gulp-minify-html/issues/22#event-286358362

I'm using svg filters on html5 video. My svg code is:

<svg id='image' version="1.1" xmlns="http://www.w3.org/2000/svg">
                            <defs>
                                <filter id="blurEffect">
                                    <feGaussianBlur stdDeviation="4"/>
                                </filter>
                                <filter id="turbulence">
                                    <feTurbulence baseFrequency=".01" type="fractalNoise" numOctaves="3" seed="23" stitchTiles="stitch"/>
                                </filter>
                                <filter id="blur">
                                    <feGaussianBlur stdDeviation="10,3" result="outBlur"/>
                                </filter>
                                <filter id="inverse">
                                    <feComponentTransfer>
                                        <feFuncR type="table" tableValues="1 0"/>
                                        <feFuncG type="table" tableValues="1 0"/>
                                        <feFuncB type="table" tableValues="1 0"/>
                                    </feComponentTransfer>
                                </filter>
                                <filter id="convolve">
                                    <feConvolveMatrix order="3" kernelMatrix="1 -1  1 -1 -0.01 -1 1 -1 1" edgeMode="duplicate" result="convo"/>
                                </filter>
                                <filter id="blackandwhite">
                                    <feColorMatrix values="0.3333 0.3333 0.3333 0 0
                                    0.3333 0.3333 0.3333 0 0
                                    0.3333 0.3333 0.3333 0 0
                                    0      0      0      1 0"/>
                                </filter>
                                <filter id="convolve2">
                                    <feConvolveMatrix filterRes="100 100" style="color-interpolation-filters:sRGB" order="3" kernelMatrix="0 -1 0   -1 4 -1   0 -1 0" preserveAlpha="true"/>
                                </filter>
                                <filter id="offset" x="-10%" y="-20%" height="230%" width="140%" transform="translate(90,0)">
                                    <feGaussianBlur stdDeviation="14"/>
                                    <feOffset dx="0" dy="240" result="B"/>
                                    <feMerge>
                                        <feMergeNode in="B"/>
                                        <feMergeNode in="SourceGraphic"/>
                                    </feMerge>
                                </filter>
                                <filter id="myblur">
                                    <feGaussianBlur stdDeviation="1"/>
                                </filter>
                                <filter id="myconvolve">
                                    <feConvolveMatrix filterRes="100 100" style="color-interpolation-filters:sRGB" order="3" kernelMatrix="0 -1 0   -1 4 -1   0 -1 0" preserveAlpha="true"/>
                                </filter>
                                <filter id="bluefill" x="0%" y="0%" width="100%" height="100%">
                                    <feFlood flood-color="blue" result="A"/>
                                    <feColorMatrix type="matrix" in="SourceGraphic" result="B" values="1   0  0  0 0  
                                    0   1  0  0 0   
                                    0   0  1  0 0   
                                    1   1  1  0 0
                                    "/>
                                    <feMerge>
                                        <feMergeNode in="A"/>
                                        <feMergeNode in="B"/>
                                    </feMerge>
                                </filter>
                                <filter id="noir">
                                    <feGaussianBlur stdDeviation="1.5"/>
                                    <feComponentTransfer>
                                        <feFuncR type="discrete" tableValues="0 .5 1 1"/>
                                        <feFuncG type="discrete" tableValues="0 .5 1"/>
                                        <feFuncB type="discrete" tableValues="0"/>
                                    </feComponentTransfer>
                                </filter>
                            </defs>
                        </svg>

Minified it comes through as this:

<svg id=image version=1.1 xmlns=http://www.w3.org/2000/svg><defs><filter id=blurEffect><fegaussianblur stddeviation=4></fegaussianblur></filter><filter id=turbulence><feturbulence basefrequency=.01 type=fractalNoise numoctaves=3 seed=23 stitchtiles=stitch></feturbulence></filter><filter id=blur><fegaussianblur stddeviation=10,3 result=outBlur></fegaussianblur></filter><filter id=inverse><fecomponenttransfer><fefuncr type=table tablevalues="1 0"><fefuncg type=table tablevalues="1 0"><fefuncb type=table tablevalues="1 0"></fefuncb></fefuncg></fefuncr></fecomponenttransfer></filter><filter id=convolve><feconvolvematrix order=3 kernelmatrix="1 -1 1 -1 -0.01 -1 1 -1 1" edgemode=duplicate result=convo></feconvolvematrix></filter><filter id=blackandwhite><fecolormatrix values="0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0"></fecolormatrix></filter><filter id=convolve2><feconvolvematrix filterres="100 100" style=color-interpolation-filters:sRGB order=3 kernelmatrix="0 -1 0 -1 4 -1 0 -1 0" preservealpha=true></feconvolvematrix></filter><filter id=offset x=-10% y=-20% height=230% width=140% transform=translate(90,0)><fegaussianblur stddeviation=14><feoffset dx=0 dy=240 result=B><femerge><femergenode in=B><femergenode in=SourceGraphic></femergenode></femergenode></femerge></feoffset></fegaussianblur></filter><filter id=myblur><fegaussianblur stddeviation=1></fegaussianblur></filter><filter id=myconvolve><feconvolvematrix filterres="100 100" style=color-interpolation-filters:sRGB order=3 kernelmatrix="0 -1 0 -1 4 -1 0 -1 0" preservealpha=true></feconvolvematrix></filter><filter id=bluefill x=0% y=0% width=100% height=100%><feflood flood-color=blue result=A><fecolormatrix type=matrix in=SourceGraphic result=B values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 1 1 1 0 0"><femerge><femergenode in=A><femergenode in=B></femergenode></femergenode></femerge></fecolormatrix></feflood></filter><filter id=noir><fegaussianblur stddeviation=1.5><fecomponenttransfer><fefuncr type=discrete tablevalues="0 .5 1 1"><fefuncg type=discrete tablevalues="0 .5 1"><fefuncb type=discrete tablevalues=0></fefuncb></fefuncg></fefuncr></fecomponenttransfer></fegaussianblur></filter></defs></svg>

Some of the filters work but others are broken

Should not remove empty href as this effects tab order

<a href="">click me</a>

minimises to

<a>click me</a>

The removal of the href means that this element is no longer included in the tab order.

I am working around this with { empty: true }.

I thing the expected output would be as this does not affect the behaviour.

<a href>click me</a>

[Issue] Keep empty attributes assigned pointless empty value

When the "keep empty attributes" option is enabled, the compiled HTML actually grows because the attribute is given an empty string value even if it has no value before.

Example, the following:

<div translate>Test</div>

Is compiled to:

<div translate="">Test</div>

The use case that applies here is AngularJS directives, though I'm sure there are other use cases for attributes without a value. The issue was originally raised by @udayms here: https://github.com/jonathanepollack/gulp-minify-html/issues/6

Thanks

Minifier distors template directives

I have html underscore templates and I try to minify them.
After minification templates distored
Before:
<%- name %>
After minification:
<%-name></%-name>

self-closing tags

Hi!

I noted that minimize(v. 0.9.0) incorrectly processes the self-closing tags.
Before:

<div />
<h1>Hello world</h1>

After:

<div><h1>Hello world</h1></div>

It is not correct to use self-closing div, but it's just an example. I use angular, and there is same issue for any custom tag.

Inline SVG self-closing tags

In the same vein as #23 but with a common use scope, certain inline SVG elements are breaking due to changes in self-closing tags. In this case 'quotes:true' is optioned to prevent breaking of fill declarations, e.g. fill="url(#foo)".

Source:

<linearGradient id="foo">
  <stop offset="0" stop-color="#fff" />
  <stop offset="1" stop-color="#000" />
</linearGradient>

Output :

<lineargradient id="foo">
  <stop offset="0" stop-color="#FFF">
    <stop offset="1" stop-color="#000">
    </stop>
  </stop>
</lineargradient>

While this effects many SVG elements it does not seem to break primitives such as <rect /> and <circle />, no doubt these elements are a little more robust.

Benchmarks

Hello,

Due to some discussion over on the generator-gulp-webapp repo I have inadvertantly created some benchmarks for you. I noticed the benchmarks section on your readme was blank, so perhaps you now have some data to add.

The benchmark tool is here: https://github.com/austinpray/html-minifier-tests

My results are here: csv and json

graph

For a bit of discussion on what the "percent saved" metric is: yeoman/generator-webapp#215 (comment)

Example data:

Action Savings
Nothing 0%
Minify 35.15%
Gzip 70.44%
Gzip and Minify 77.60%
∆ Gz and Gz+Min 7.16%

Compared to leaving the html file alone and minifying there is only a 7.16% difference once gzip is added to the equation.

Ultimately it seems like the larger the html file the less of a difference minifying the html makes. This make sense due to the way the gzip algorithm makes.

AngularJS Material Design Attributues

Hi,

I've been using minimze via gulp-minify-html to create cached angularjs templates.

I've been migrating an AngularJS app to use https://material.angularjs.org/#/ and have found some material design tags were being stripped out by minimize.

For example 'hide-sm' and 'hide-md' in this example:

        <div hide-sm hide-md class="b-header__pos_right">
            <a ng-href="http://google.com">Google</a>
        </div>

Mimimizes down to:

<div class=\"b-header__pos_right\"><a ng-href=\"http://google.com\">Google</a></div>

If I add hide-sm and hide-md to the exports.redundant array in list.js it works OK (not stripped out).

Is supporting Google's material design something you'd consider?

If so I can assist by getting together a list of attribues for material design we could add into minimize.

Cheers.

Conditional IE comments bug

Hi, I am using your minimizer through https://github.com/jonathanepollack/gulp-minify-html and I found a bug.

With the option conditionals: true, I have an error in the output.

Input:

<!--[if lt IE 9]>      <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

Output:

<!--[if lt IE 9]>      <html class="no-js lt-ie9"> <![endif]--><html class=no-js lang=en>

The second conditional is not retained, probably because it is mixed with HTML comments to hide the conditional to other browsers.

Also note that the spaces should be removed.

(This is code is used in http://html5boilerplate.com/, see the output with "IE classes".)

Support for django template tags

I have in my django template:
<input type="checkbox" {% if not conts %}disabled="true"{% endif %}>

and when minified, I get:
<input type=checkbox {%="" if="" not="" conts="" %}disabled=true endif="" %}="">

I have set "quotes" to false, but still get same output. How do I fix this?

non-callback API

Can we have a API like this
var Minimize = require('minimize')
, minimize = new Minimize({});

var resultData = minimize.parse(content);

The reason is, in some situation, it needs to be in a callback which is expected to return a result from the parser,
For example, the string replace in place,
String.replace(Regex, callback_function(rawhtml_snippet_match) {
return minimize.parse(rawhtml_snippet_match);
});

Thanks.

Concatinates content when minimizing a paragraph

<p>So you wish to learn the ways of Nodejitsu? Excellent! You only need to know
three things to get started:</p>

Is transformed to

<p>So you wish to learn the ways of Nodejitsu? Excellent! You only need to knowthree things to get started:</p>

Instead of

<p>So you wish to learn the ways of Nodejitsu? Excellent! You only need to know three things to get started:</p>

cli-color version?

Hi, I already mentioned this to the gulp-minify-html developer who uses "minimize", but then realized the warning I was getting was probably generated because of "minimize" dependency on an older version of cli-color...

Hi, I realize this is fairly obsessive-compulsive of me, but... I'm trying to tidy up my npm dependencies in a project and notice gulp-minify-html calls for cli-color 0.3.x, but the latest cli-color is 1.0.0. Whenever you get around to it, is it possible you might consider updating your cli-color dependency to cli-color 1.0.0 ? (Please see below)... apologies if this is totally annoying. Just thought I'd ask. Thanks and regards -dB

davids-mbp:dBWeb davidwbarrows$ npm outdated
Package Current Wanted Latest Location
cli-color 0.3.3 0.3.3 1.0.0 cli-color
lodash 2.4.2 2.4.2 3.10.1 lodash
merge-stream 0.1.8 0.1.8 1.0.0 merge-stream
davids-mbp:dBWeb davidwbarrows$ npm update
npm WARN unmet dependency /Users/davidwbarrows/Data/Computing/Angular/dBWeb/node_modules/gulp-minify-html/node_modules/minimize requires cli-color@'0.3.x' but will load

white space in attribute is not stripped

i have some inline style in my div

<div style="margin: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-position: 50% 50%;">
  </div>

But after minimize using gulp-minify-html the white spaces is still there (it could just make all the attribute values oneline).

Problem with svg

In my html I have the follow svg code

<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" points="133.7,107.2 143.6,47.4 98.8,0 57.2,43.6 118.7,52.4 "/>

<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" points="83.8,134.6 143.6,144.6 191,99.3 147.4,57.3 138.7,119.4
                            "/>
<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" points="58,84.8 45.9,144.6 89.4,192 132.7,148.4 71.1,139.6 "/>

<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" points="109.1,57.5 49.2,47.4 0,92.7 42.5,134.6 53.4,72.6 "/>

When the HTML is minified

<polygon fill-rule=evenodd clip-rule=evenodd fill=#FFFFFF points="133.7,107.2 143.6,47.4 98.8,0 57.2,43.6 118.7,52.4">
    <polygon fill-rule=evenodd clip-rule=evenodd fill=#FFFFFF points="83.8,134.6 143.6,144.6 191,99.3 147.4,57.3 138.7,119.4">
        <polygon fill-rule=evenodd clip-rule=evenodd fill=#FFFFFF points="58,84.8 45.9,144.6 89.4,192 132.7,148.4 71.1,139.6">
             <polygon fill-rule=evenodd clip-rule=evenodd fill=#FFFFFF points="109.1,57.5 49.2,47.4 0,92.7 42.5,134.6 53.4,72.6"></polygon>
        </polygon>
    </polygon>
</polygon>

This problem unconfigures the svg picture.

feature: Allow hooks or plugins for custom minifiers

It would be nice if we were given some more control over the minification process. For example I want to be able to remove classNames and id's if they are not present in the CSS that is loaded in the page. This undertaking is probably to big and error prone to be a feature inside of minimize it as I know many more examples as well, like css compression for style attributes and tags. Minification of js files etc. This would unleash a new potential eco system for this module it self.

Whitespace with 'white-space: pre'

There are a lot of situations in which we'll want to tell an element to use pre for white-space without using the <pre/> tag, rather through css. Github actually makes heavy use of this technique. With the goal of this module being to reduce the size of the resulting html, placing a <pre/> tag in each one of those situations negates the point. Adding margins, padding isn't an option when you're in need of that whitespace. And replacing spaces with &emsp; or &nbsp; also adds unneeded size to the resulting html.

What can be done to counteract the removal of intended whitespace between elements which have that style applied?

[Issue] Legitimate spacing being removed

Hey,

Sorry for the onslaught of issues from me... I have noticed one more though.

Spacing is being removed around elements, for example:

<p>Enter your name: <input type="text" name="person_name"> <button>Save</button></p>

Is compiled to:

<p>Enter your name:<input type="text" name="person_name"><button>Save</button></p>

Is this expected behaviour? I often use spacing around form elements (rather than always using CSS to space them apart) and imagine that this is quite common. Of course &nbsp; is an option here but I'm not sure changing the source is the right solution.

Hopefully my last one, sorry! If it improves the software though, it must be a good thing. :)

Thanks

[Issue] Quotes removed where they shouldn't be

I have found a case where quotes which should not have been removed are erroneously being removed.

In my case, the following HTML:

<ng-include src="'path/to/my/template.html'"></ng-include>

Is compiled to this:

<ng-include src='path/to/my/template.html'></ng-include>

The value of "src", as the interpreter sees it, changes from "path/to/my/template.html" wrapped with singular quotes around it to just "path/to/my/template.html".

So in this case, the attribute quotes should not be removed (just like they aren't removed in other cases). As a temporary solution I'll set the "quotes" option to true, but this still definitely appears to be a bug as the value in the minified state is no longer interpreted the same way as the value in the unminified state.

My particular use case is with Angular where you may be required to provide a string value within an attribute like above.

Thanks

Minify removes "echo $this-" php code unnecessarily

For this line

<body<?php echo $this->getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>

The minified version removes "echo $this-"

<body<?php>getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>

The result is that the embedded php tag becomes a string, it's not run and it's displayed on the browser

I noticed this issue when using the gulp version as reported here https://github.com/jonathanepollack/gulp-minify-html/issues/14

But I was wondering if someone here knows whether text can be marked to be skipped or something similar

Whitespace issue

How does minimize currently determine which whitespace it should preserve?
The issue I am having is that minimize is stripping whitespace which is used for styling. Take the buttons from Bootstrap, for example. The styling of the buttons relies on the whitespace you have between them. As soon as you remove that whitespace, the buttons are 'glued' together.

I believe the only safe way of reducing whitespace inside elements is replacing each whitespace with a single space. You can't assume, for example, that a div will always be styled as a block.

What is your take on this? Maybe there should be some option(s) added, so the user can decide what should be preserved?

CLI not found

Hi. I've installed minimize, package.json points to ^1.2.0 version.
When I create npm script:

"test": "minimize --help"

And when I do npm run test, I get minimize: command not found from shell.

I assume "bin" property is missing in your package.json. I assume that it should be like in jade

npm: 2.6.1, node: 0.12.0

Minifying HTML and PHP one line comments can break output

When minifying this:

<?php
  // comment 1
  function foo() {
    echo '<div>
    </div>';
  }

  // comment 2
  function bar() {
    echo '<div>
    </div>';
  }
?>

You get this output:

<?php
  // comment 1
  function foo() {
    echo '<div></div>'; } // comment 2 function bar() { echo '<div></div>';} ?>

The two slashes in from of comment 2 now comment out the entire function.

Ignore certain blocks from minification?

I have a large block of static markdown text that later gets parsed by my javascript.

ie,

<span id="code demo">
    **Test**

    blah blah blah
    ---

    ```
    // This is how to print to console:
    console.log(myvariable);
    ```

    > He said, She said.

</span>

When I minify this, all the spacing gets removed and so the resulting markdown looks all squished when rendered.

Specifying empty: true, loose: true, spare: true does not help.

Is there a way I can keep my markdown text in HTML, but tell minimize to ignore this block?

getting error

When running gulp-minify-html I'm getting this error:

PS C:\Users\Alexander\artendb> gulp prod
request:  couchapp push http://user:[email protected]:5984/artendb
[10:36:30] Using gulpfile ~\artendb\gulpfile.js
[10:36:30] Starting 'prod'...
[10:36:30] Starting 'browserify'...
[10:36:30] Running 'bundle'...
[10:36:30] Finished 'prod' after 23 ms
[10:36:33] Finished 'bundle' in 2.57 s
[10:36:33] Finished 'browserify' after 2.59 s
[10:36:33] Starting 'prod_build_style'...
[10:36:33] Starting 'prod_build_src'...
[10:36:33] Starting 'prod_build_html'...
C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\lib\helpers.js:82
  return !!~list.inline.indexOf(element.name);
           ^
RangeError: Maximum call stack size exceeded
    at String.replace (native)
    at Helpers.text (C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\lib\helpers.js:223:3
1)
    at enter (C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\lib\minimize.js:120:45)
    at reduce (C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\lib\minimize.js:106:33)
    at C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\node_modules\async\lib\async.js:27
2:13
    at iterate (C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\node_modules\async\lib\as
ync.js:149:13)
    at C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\node_modules\async\lib\async.js:16
0:25
    at C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\node_modules\async\lib\async.js:27
4:17
    at close (C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\lib\minimize.js:137:7)
    at C:\Users\Alexander\artendb\node_modules\gulp-minify-html\node_modules\minimize\node_modules\async\lib\async.js:27
7:13
PS C:\Users\Alexander\artendb>

my index.html is here: https://github.com/FNSKtZH/artendb/blob/master/_attachments/index_dev.html
this used to work
a few weeks ago I updated from version 0.1.6 to 0.1.8. This is the first time I've minified since.
I updated to 1.0.1 now but the error persists.

I reported this issue at https://github.com/jonathanepollack/gulp-minify-html first (https://github.com/jonathanepollack/gulp-minify-html/issues/20) but @jonathanepollack asked me to bring it up here

Keep attribute casing

Not sure when it's happening, maybe in the html parser, but attributes that have capital letters end up being lowercased. Anyway to keep this from happening?

Space added around elements within words

Expected <span>C</span>orporation to output unchanged. Instead the output is <span>C</span> orporation, rendering a gap in the browser.

Similarly <a>C</a><a>orporation</a> becomes <a>C</a> <a>orporation</a> and <a>C</a> ,orporation actually becomes <a>C</a>,orporation.

Conditionals not working

Hi! First, congratulations for minimize. It´s awesome! :)

I´m afraid that "conditionals" is not working properly for me...
I´m trying to keep this coditional below, without success:

<!--[if lt IE 10]>
        [...]
<![endif]-->

I thought it was something with the regex, but I tried other ways, like this below, without success.

<!--[if ie6]>
        [...]
<![endif]-->

Thanks in advance

Regards,

autocomplete="off" is changed to autocomplete which is opposite of meaning.

I have the following html

<input autocomplete="off">

autocomplete="off" is set to prevent the browser suggesting entries in a dropdown. I want to provide my own drop down using javascript.

When minimised I get

<input autocomplete>

Which is not semantically equivalent as this turns on autocomplete

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.