webpack使用raw-loader内联静态资源失效

失效代码
<script>${ require('raw-loader!babel-loader!./page/demo.js') }</script>

原因及解决办法
由于html-webpack-plugin解析语法的改变，将${ "code" }写法改为了<%= "code" %>
将原有的写法改为新写法即可

// 由于html-webpack-plugin解析语法的改变，将${ "代码" }标识符改为了<%= "代码" %>
<script><%=require('raw-loader!babel-loader!./page/demo.js')%></script>

顺便说一下raw-loader@0.5.1，对比了一下raw-loader新版本的源码。发现问题出在导出语法上。
新版本的raw-loader，默认情况下，raw-loader生成使用ES模块语法的JS模块。

老版本 0.5.1
module.exports = function(content) {
    this.cacheable && this.cacheable();
    this.value = content;
    // 0.5.1导出方式
    return "module.exports = " + JSON.stringify(content);
}

新版本
function rawLoader(source) {
  const options = (0, _loaderUtils.getOptions)(this);
  (0, _schemaUtils.default)(_options.default, options, {
    name: 'Raw Loader',
    baseDataPath: 'options'
  });
  const json = JSON.stringify(source).replace(/\u2028/g, '\\u2028').replace(/\u2029/g, '\\u2029');
  // 将true 改为false
  const esModule = typeof options.esModule !== 'undefined' ? options.esModule : true;
  /*const esModule = typeof options.esModule !== 'undefined' ? options.esModule : false;*/
  // esModule 控制导出方式
  return `${esModule ? 'export default' : 'module.exports ='} ${json};`; 
}

兼容办法：在node_modules中找到raw-loader/dist/index中将esModule的默认值改为false即可

如图所示：