ES6 - IE 11 的模板字符串破解答案

【问题标题】：ES6 - Template strings hack for IE 11ES6 - IE 11 的模板字符串破解
【发布时间】：2018-10-02 10:32:16
【问题描述】：

我在 JS 文件中使用了很长的 HTML 模板脚本，例如：

var TEMPLATE = `
<div>
  <ul>
    <li>first</li>
    <li>second</li>
    <li>third</li>
  </ul>
</div>`;

它适用于所有浏览器（包括 Chrome、Safari、Firefox 和 EDGE），但不适用于 Internet Explorer 11、10。

你能建议我如何解决这个问题吗？

【问题讨论】：

尝试使用 Babel：babeljs.io/docs/en
因为你使用的是template literals 哪个aren't supported in IE，你可以把它改成普通字符串或者像@Michelangelo 说的那样，使用Babel
是的，我知道“IE 不支持模板文字”。 @Michelangelo，你能描述一下我如何使用 Babel 吗？我正在使用 AngularJS。
Template literals not working in IE11 when "use strict" directive is used的可能重复
@om。不，这不是编程课，我也不是老师。文档很清楚。你必须自己解决这个问题。

标签： javascript ecmascript-6

【解决方案1】：

如果您不需要模板文字中提供的任何高级功能（例如 ${foo}），您也可以考虑使用正则引号并转义新行以防止语法错误，如下所示：

var list = '\
    <div>\
        <ul>\
            <li>first</li>\
            <li>second</li>\
            <li>third</li>\
        </ul>\
   </div>\
';

【讨论】：