HTML5, ES6 template string polyfill

Question

For our application we need to use new feature template string.

var verLongKey= `834r845784576485
y84ery5845y485yu843
483y53485684576845
jhu87843647356756745==457485,mh
ererthe8t0998785==ery8`;

But old browsers(like android default browsers) don't support template string.

How can I get polyfill for this feature? Tried babel. We got this polyfill working for all features but template string. Currently using modernizr to detect support and show alert to use other browser. This approach is annoying for users. How can i get some polyfill to make this work on the non supporting browsers?

What made us this template strings. The problem is i can't use these tools(trceur,babel) as this file is generated on the production from puppet. There is no way we will run these transpilers there. want to add some polyfill on the browser side. the key contains some \n characters in it need to preserve those. I want some polyfill so, i can include before the configs js file.

Answer 1

There are 3 main ES6 polyfills that can give you template string support but none of them have full support as you can see at kangax's ECMAScript support table.

• Traceur - This is Google's ECMAScript polyfill that support some ECMAScript 6 and ECMAScript next features, it have 4/5 support for template strings, there is no toString conversion.

• Babel - Another ECMAScript polyfill, have more support in general but also have only 4/5 support for template strings, also no toString conversion.

• es6-shim - I'm not sure if it's even developed anymore, but it doesn't have template strings anyway.

But you might want to think twice before using template string, it just a syntactic sugar for string with + to add variables and \ to have multi lines.