Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

minifier crashes on attribute names that end with $ #377

Closed
jcgregorio opened this issue Jun 15, 2015 · 5 comments
Closed

minifier crashes on attribute names that end with $ #377

jcgregorio opened this issue Jun 15, 2015 · 5 comments
Labels
needs-confirmation

Comments

@jcgregorio
Copy link

The following document can't be minified, it crashes with "Error: Minification error":

<html>
<body class$="foo">
</body>
</html>

$ html-minifier out.html
Error: Minification error

This stops html-minifier from being used on Polymer 1.0:

https://www.polymer-project.org/1.0/docs/devguide/data-binding.html#attribute-binding

$ is a valid character in an attribute name:

https://html.spec.whatwg.org/multipage/syntax.html#attributes-2
@fregante
Copy link
Contributor

fregante commented Jul 1, 2015

According to the docs, you should be able to use the customAttrAssign array to make that work.

@ecoutu
Copy link

ecoutu commented Jul 8, 2015

I spent a few hours on this myself, you need to utilize the customAttrAssign option to let html-minifier know about =$ assignments. I was absolutely unable to get it to work from the command line, but I'm using a gulp build process, so it was a breeze to do it programatically:

var html = fs.readFileSync('public/index.built.html').toString();
var minifiedHtml = minify(html, {
    customAttrAssign: [/\$=/],
    removeComments: true,
    collapseWhitespace: true
});

fs.writeFileSync('public/index.min.html', minifiedHtml);

I gave up trying to get it to minimize the css, I don't think it's possible if you are using css variables and mixins.

@Compufreak345
Copy link

+1 I got the same issues and am currently not using gulp. If there is any hint how I can translate the script from ecoutu to command line parameters (I tried it and failed) I would highly appreciate it. Otherwise I have to start using gulp as well, or maybe drop the grunt-bomb and try https://github.com/KK578/grunt-minify-polymer what promises fixing all the issues with css & javascript. Not sure if it's suitable, still open for ideas. Hard to find any solution to minimize a vulcanized file :0

/edit : FYI for anyone coming here before the issue is fixed : I ended up using grunt-minify-polymer and got from 882 to 504 KB now.

@JosefJezek
Copy link

+1

@kangax kangax closed this as completed Oct 25, 2015
@richardanaya
Copy link

Was this ever resolved?

@jcgregorio jcgregorio mentioned this issue Jan 3, 2019
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
needs-confirmation
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
7 participants
@kangax @richardanaya @ecoutu @fregante @jcgregorio @JosefJezek @Compufreak345