asyncLiz / minify-html-literals

Minify HTML template literal strings
MIT License
68 stars 13 forks source link

Error: splitHTMLByPlaceholder() must return same number of strings as template parts #28

Closed CheloXL closed 3 years ago

CheloXL commented 3 years ago

I have the following code

uhtml.render(this._view, uhtml.html`
<div class="calendar-button-holder">
    <button onclick="${() => this.moveCalendar(-1, 0)}"></button>
</div>`);

And the library is throwing the above error. Peeking your code, I saw in ensureHTMLPartsValid, htmlParts receives an array that has one entry that looks like <button onclick="@TEMPLATE_EXPRESSION()", and I believe that's where things go wrong, as that entry should actually be two entries.

Not sure why, but if instead of onclick I use any other attribute, things works. In fact, any attribute that starts with on seems to break the minification.

asyncLiz commented 3 years ago

Should be fixed now on the main branch!

orindholt commented 2 years ago

Hi. I know this is quite old, but I'm still getting this issue when trying to compile lit-html with the rollup plugin.

rollup.config.mjs:

import template from 'rollup-plugin-html-literals';
export default {
  input: ['src/**/*.ts'],
  output: {
    dir: 'dist',
  },
  plugins: [ 
     template(),
     typescript({
       outDir: 'dist',
     }),
     /* other rollup plugins... */
   ],
  preserveEntrySignatures: 'strict',
};

Version: "rollup-plugin-html-literals": "^1.1.5",

Generates the dist folder with the js files generated from the typescript plugin as expected, but with the html in the components not being minified and logging: (!) Plugin html-literals: splitHTMLByPlaceholder() must return same number of strings as template parts

I've tried using the rollup-plugin-minify-html-literals plugin, and I've tried running it before the typescript plugin is run, with no luck.

Thanks in advance!

orindholt commented 2 years ago

Never mind! Found the solution. It couldn't be minified because there was a comment, with a template literal inside...