7 html-webpack-plugin的两个基本作用
html-webpack-plugin的作用:
1.在内存中根据我们的index模板页面,生成一个内存里面的首页
2.当使用html-webpack-plugin之后,我们不再需要手动处理bundle.js的引用路径了,
因为这个插件,已经帮我们自动创建了一个合适的script,并且,引用了正确的路径
简要概述两个作用:
1.自动在内存中根据指定页面生成一个内存的页面
2.自动把打包好的bundle.js追加到页面中去

运行 cnpm i html-webpack-plugin -D 安装到开发依赖
//第1步
// 导入内存中生成HTML页面的插件
// 只有是插件,都一定要放到Plugins节点中去
const htmlWebpackPlugin=require('html-webpack-plugin')
//第2步
new htmlWebpackPlugin({//创建一个在内存中 生成HTML页面的插件
template:path.join(__dirname,'/src/index.html'),//指定 模板页面,将来会根据指定的页面路径,去生成内存中的页面
filename:'index.html' //指定生成的页面的名称
})
7 html-webpack-plugin的两个基本作用的更多相关文章
- 如何开发webpack plugin
继上回介绍了如何开发webpack loader 之后.趁热打铁,来继续看下webpack另一个核心组成:plugin. 下面也和loader一样,让我们一起从基本的官方文档着手看起. loader和 ...
- 简单webpack plugin 开发
重要是学习下怎么开发webpack plugin,同时记录下 插件模型 webpack 是一个插件,可以是javascript class ,或者具名 class 定义apply 方法 指定一个绑定到 ...
- 揭秘webpack plugin
前言 Plugin(插件) 是 webpack 生态的的一个关键部分.它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程.这篇文章将尝试探索 webpack plu ...
- Webpack Plugin
[Webpack Plugin] Since Loaders only execute transforms on a per-file basis, plugins are most commonl ...
- 案例实战之如何写一个webpack plugin
案例实战之如何写一个webpack plugin 1.写一个生成打包文件目录的file.md文件 // 生成一个目录项目目录的文件夹 class FileListPlugin { constructo ...
- YYDS: Webpack Plugin开发
目录 导读 一.cdn常规使用 二.开发一个webpack plugin 三.cdn优化插件实现 1.创建一个具名 JavaScript 函数(使用ES6的class实现) 2.在它的原型上定义 ap ...
- webpack的安装 以及 问题 以及 作用
参考链接: https://blog.csdn.net/Rnger/article/details/81086938 https://blog.csdn.net/qq_38111015/art ...
- Vue系列之 => html-webpack-plugin的两个基本作用
安装 npm i html-webpack-plugin -D webpack.config.js const path = require('path'); //启用热更新的第二步,导入webpac ...
- C语言中两个!!的作用
两个!是为了把非0值转换成1,而0值还是0. 因为C语言中,所有非0值都表示真. 所以!非0值 = 0,而!0 = 1.所以!!非0值 = 1,而!!0 = 0.例如:i=123 !i=0 !!i=1 ...
随机推荐
- 异步I/O、事件驱动、单线程
异步I/O.事件驱动.单线程 nodejs的特点总共有以下几点 异步I/O(非阻塞I/O) 事件驱动 单线程 擅长I/O密集型,不擅长CPU密集型 高并发 下面是一道很经典的面试题,描述了node的整 ...
- KVM虚拟机两种配置的概念不同之处
KVM虚拟机配置的两种方式之间的不同之处 NAT方式 NAT模式中,让虚拟机借助NAT(网络地址转换)功能,通过宿主机器所在的网络来访问公网. NAT模式中,虚拟机的网卡和物理网卡的网络,不在同一个网 ...
- Appium移动自动化测试-----(五) java-client安装与测试
前提条件 当你点击这一章时,说明你是打算使用 Java 语言编写 appium 自动化测试脚本的. 1.安装 Java 环境 ,我想这一步你已经搞定了 2.安装 IntelliJ IDEA , 当然, ...
- GWAS中的名称概念
基因: 是指决定生物某一遗传性状的染色体DNA片段 基因型: `基因型`又称`遗传型`,是某一生物个体全部基因组合的总称.它反应生物体的遗传构成,即从双亲获得的全部基因的总和.遗传学中具体使用的基因型 ...
- PHP,Excel导出换行
// 有id,才算真的有发票数据 if ($v['b_invoice_id']) { $v['b_invoice_info'] = json_decode($v['b_invoice_json'],t ...
- Bayesian machine learning
from: http://www.metacademy.org/roadmaps/rgrosse/bayesian_machine_learning Created by: Roger Grosse( ...
- js实现限制容器中字符个数
html: <div class="ellipsis"> 夜空中最亮的星/请指引我走出去/夜空中最亮的星 是否知道/那曾与我同心的身影 如今在哪里/夜空中最亮的星 是否 ...
- 将oracle关键字作为字段名
对于关键字比如:Level.uid.group等 如果在数据库设计的时候,没有考虑oracle数据库的特殊性时,可能会使用关键字作为字段名,从而在建表的过程中,提示错误:ORA-00904: inva ...
- docker学习笔记(一)--介绍和基本组成
Docker基本介绍 1.什么是docker docker本身不是容器,是创建容器的工具,是应用容器引擎,将应用程序自动部署到容器的开源引擎. 2.docker的目标特点 简单轻量,快速开发,具备可移 ...
- Python之推导式笔记
观察下面的代码: list1 = [] for i in range(10): list1.append(i) print(list1) 作为一个Java出身的程序员,我一定会这么写代码去生成一个列表 ...