html-webpack-plugin在html中插入数据
<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8"/>

    <title><%= htmlWebpackPlugin.options.title %></title>

  </head>

  <body>

  </body>

</html>

查看文档，有如下介绍：
可以使用lodash语法在模板中注入数据。
下面的变量在模板中可以使用：

  • htmlWebpackPlugin.options: 通过new htmlWebpackPlugin(options)传递.
  • webpack: 通过compilation.getStats().toJson()得到的一个对象.
  • webpackConfig对象: 比如 webpackConfig.output.publicPath获取webpack.prod.conf.js中的publicPath
  • compilation对象.
  • htmlWebpackPlugin.files: 格式如下
"htmlWebpackPlugin": {

  "files": {

    "css": [ "main.css" ],

    "js": [ "https://www.baidu.com/static/js/app.cfebce17280ae88b6b7b.js"],

    "chunks": {}

  }

}

如何实现的呢？
主要在emit阶段，通过如下方法实现(/node_modules/html-webpack-plugin/index.js)：

HtmlWebpackPlugin.prototype.executeTemplate

= function (templateFunction, chunks, assets, compilation) {

  var self = this;

  return Promise.resolve()

    // Template processing

    .then(function () {

      var templateParams = {

        compilation: compilation,

        webpack: compilation.getStats().toJson(),

        webpackConfig: compilation.options,

        htmlWebpackPlugin: {

          files: assets,

          options: self.options

        }

      };

      var html = '';

      try {

        html = templateFunction(templateParams);// 注入到模板方法中

      } catch (e) {...}

      return html;

    });

};

html-webpack-plugin在html中插入数据的更多相关文章

  1. 使用C#向ACCESS中插入数据

    使用C#向ACCESS中插入数据   1.创建并打开一个OleDbConnection对象 string strConn = " Provider = Microsoft.Jet.OLEDB ...

  2. 触发器修改后保存之前的数据 表中插入数据时ID自动增长

    create or replace trigger t before update on test5 for each rowbegin insert into test55 values (:old ...

  3. Hive通过查询语句向表中插入数据注意事项

    最近在学习使用Hive(版本0.13.1)的过程中,发现了一些坑,它们或许是Hive提倡的比关系数据库更加自由的体现(同时引来一些问题),或许是一些bug.总而言之,这些都需要使用Hive的开发人员额 ...

  4. 向Oracle数据库中插入数据出错：ORA-01036 无效的变量名或数据

    向Oracle数据库中插入数据出错: 经过排查,因为Update数据时没有出错,所以OracleHelper没有问题: 看异常信息提示:无效的变量和数据,应该是SQL语句的问题,调试时所传的实例Use ...

  5. 解决getJdbcTemplate往oracle数据库中插入数据返回主键出错问题

    我们使用Spring中的JdbcDaoSupport往Mysql中插入数据并返回主键代码,我们使用的mysql数据库,主键在数据库中设置为自增长:该类继承自JdbcDaoSupport,所以能直接使用 ...

  6. Java程序在向mysql中插入数据的时候出现乱码

    今天在往数据库中插入数据的时候中文字符在数据库中就出现了乱码?网上有各种说法,但是适合我的,最终解决我的问题的只有下面一种! 在创建数据库的时候,注意设置编码方式. CREATE DATABASE ` ...

  7. 错误 0xc0202049: 数据流任务 1: 无法在只读列“ID”中插入数据

    数据库导入导出时总失败,错误信息如下: 正在验证 (错误) 消息错误 0xc0202049: 数据流任务 1: 无法在只读列“ID”中插入数据. (SQL Server 导入和导出向导) 错误 0xc ...

  8. mysql数据库中插入数据INSERT INTO SET的优势

    往mysql数据库中插入数据.以前常用 INSERT INTO 表名 (列名1,列名2…) VALUES(列值1,列值2); 如果在PHP程序中,就会写成如下示例(往商品库里增加商品) $sql = ...

  9. EF Core中，通过实体类向SQL Server数据库表中插入数据后，实体对象是如何得到数据库表中的默认值的

    我们使用EF Core的实体类向SQL Server数据库表中插入数据后,如果数据库表中有自增列或默认值列,那么EF Core的实体对象也会返回插入到数据库表中的默认值. 下面我们通过例子来展示,EF ...

随机推荐

  1. pomelo 依赖分析

    最新版本: 2.2.7 npm i pomelo 之后: ➜ haloServer npm i pomelonpm WARN deprecated node-uuid@1.4.0: Use uuid ...

  2. MySQL服务器是怎么处理客户端请求的

    不论MySQL客户端进程和服务器进程是采用哪种方式进行通信,最后实现的效果都是:客户端进程向服务器进程发送一段文本(MySQL语句),服务器进程处理后再向客户端进程发送一段文本(处理结果).那服务器进 ...

  3. Java 重写hashCode()与equals()

    为什么要重写hashCode() 和 equals() equals() 默认的Object类里面equals()方法是根据对象所在的内存来做判断的,如果两个对象引用指向的是同一个内存,则返回true ...

  4. 网络编程 套接字socket TCP UDP

    网络编程与套接字 网络编程 网络编程是什么: ​ 网络通常指的是计算机中的互联网,是由多台计算机通过网线或其他媒介相互链接组成的 ​ 编写基于网络的应用程序的过程序称之为网络编程. 网络编程最主要的工 ...

  5. 入门大数据---Flink核心概念综述

    一.Flink 简介 Apache Flink 诞生于柏林工业大学的一个研究性项目,原名 StratoSphere .2014 年,由 StratoSphere 项目孵化出 Flink,并于同年捐赠 ...

  6. 使用随机函数random来实现课堂点名

    如何使用函数random来实现课堂随机点名 1.最初的样子如下 2.点击开始点名,上面一行的文字变成名字,名字在不停的变化,开始点名变成停止点名,如下 3.点击停止点名,上面名字不动,停止点名变成开始 ...

  7. plsql截取字符串字段中的某个字符段

    截取字符串 字符串s=" hello world  ! (name) " 如果要截取括号中的字符串可以采取如下方法. select substr(s,instr(s,'(')+1, ...

  8. 手写内网穿透服务端客户端(NAT穿透)原理及实现

    Hello,I'm Shendi. 这天心血来潮,决定做一个内网穿透的软件. 用过花生壳等软件的就知道内网穿透是个啥,干嘛用的了. 我们如果有服务器(比如tomcat),实际上我们在电脑上开启了服务器 ...

  9. 栈的顺序存储和链式存储c语言实现

    一. 栈 栈的定义:栈是只允许在一端进行插入或删除操作的线性表. 1.栈的顺序存储 栈顶指针:S.top,初始设为-1 栈顶元素:S.data[S.top] 进栈操作:栈不满时,栈顶指针先加1,再到栈 ...

  10. 【Xamarin.Forms 3】页面类型

    系列目录 微信 1.[Xamarin.Forms 1]App的创建与运行 2.[Xamarin.Forms 2]App基础知识与App启动 知乎 1.[Xamarin.Forms 1]App的创建与运 ...