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的两个基本作用的更多相关文章

  1. 如何开发webpack plugin

    继上回介绍了如何开发webpack loader 之后.趁热打铁,来继续看下webpack另一个核心组成:plugin. 下面也和loader一样,让我们一起从基本的官方文档着手看起. loader和 ...

  2. 简单webpack plugin 开发

    重要是学习下怎么开发webpack plugin,同时记录下 插件模型 webpack 是一个插件,可以是javascript class ,或者具名 class 定义apply 方法 指定一个绑定到 ...

  3. 揭秘webpack plugin

    前言 Plugin(插件) 是 webpack 生态的的一个关键部分.它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程.这篇文章将尝试探索 webpack plu ...

  4. Webpack Plugin

    [Webpack Plugin] Since Loaders only execute transforms on a per-file basis, plugins are most commonl ...

  5. 案例实战之如何写一个webpack plugin

    案例实战之如何写一个webpack plugin 1.写一个生成打包文件目录的file.md文件 // 生成一个目录项目目录的文件夹 class FileListPlugin { constructo ...

  6. YYDS: Webpack Plugin开发

    目录 导读 一.cdn常规使用 二.开发一个webpack plugin 三.cdn优化插件实现 1.创建一个具名 JavaScript 函数(使用ES6的class实现) 2.在它的原型上定义 ap ...

  7. webpack的安装 以及 问题 以及 作用

    参考链接: https://blog.csdn.net/Rnger/article/details/81086938     https://blog.csdn.net/qq_38111015/art ...

  8. Vue系列之 => html-webpack-plugin的两个基本作用

    安装 npm i html-webpack-plugin -D webpack.config.js const path = require('path'); //启用热更新的第二步,导入webpac ...

  9. C语言中两个!!的作用

    两个!是为了把非0值转换成1,而0值还是0. 因为C语言中,所有非0值都表示真. 所以!非0值 = 0,而!0 = 1.所以!!非0值 = 1,而!!0 = 0.例如:i=123 !i=0 !!i=1 ...

随机推荐

  1. Beta冲刺(3/4)

    队名:秃头小队 组长博客 作业博客 组长徐俊杰 过去两天完成的任务:学习了很多东西 Github签入记录 接下来的计划:继续学习 还剩下哪些任务:后端部分 燃尽图 遇到的困难:自己太菜了 收获和疑问: ...

  2. C++用于类型转换的4个操作符

    Dynamic_cast,   const_cast,  static_cast,  reinterpret_cast. (1)reinterpret_cast 用于基本的类型转换.如 in *ip; ...

  3. 030 Android 第三方开源下拉框:NiceSpinner的使用+自定义Button样式+shape绘制控件背景图+图片选择器(selector)

    1.NiceSpinner下拉框控件介绍 Android原生的下拉框Spinner基本上可以满足Android开发对于下拉选项的设计需求,但现在越来越流行的下拉框不满足于Android原生提供的下拉框 ...

  4. Linux基础-06-vi编辑器

    1. vi编辑器简介 1) vi的定义:vi是一个UNIX和Linux系统内嵌的标准正文(文字)编辑器,它是一种交互类型的正文编辑器,它可以用来创建和修改正文文件. 2. vi编辑器的操作模式 vi编 ...

  5. EXCEL 快捷键大全

    1.ctrl+tab :快速切换已打开的excel/ppt/word同样适用 2.shift+右上角的× :关闭所有excel/ppt/word 3.ctrl+d:快速复制非文本目标,对于文本是删除 ...

  6. 11 模块、模块的搜索顺序、__file__内置属性、__name__属性

    模块的概念 一个python文件就是一个模块. 模块名同时也是一个标识符,需要符合标识符的命名规则. 在模块中定义的全局变量.函数.类 都是个外界提供的直接使用的工具. 模块就好比工具包,要想使用一个 ...

  7. 小细节--关于printf的输出问题

    关于printf输出函数,曾经在栈和队列中有过提及,并未作过深入的研究,今天在看一些面经的时候发现有的公司有所提及,那么就势研究一下 面试题如下: 首先看一下printf函数在汇编层面上是如何实现的: ...

  8. MySQL中的case when 中对于NULL值判断的坑

    sql中的case when 有点类似于Java中的switch语句,比较灵活,但是在Mysql中对于Null的处理有点特殊 Mysql中case when语法: 语法1: CASE case_val ...

  9. Hadoop 完全分布式搭建

    搭建环境 https://www.cnblogs.com/YuanWeiBlogger/p/11456623.html 修改主机名------------------- 1./etc/hostname ...

  10. sass快速使用

    sass的使用 建议使用一种语法格式(scss) scss sass转换 sass-convert main.scss main.sass sass变量声明 example: $headline-ff ...