<!-- 15  html-webpack-plugin的2个作用
下载 cnpm i html-webpack-plugin -D 作用在==>内存中生成页面 在webpack中 导入在内存中生成的HTML页面的插件
// 只要是webpack的插件 都要放入 plugins 这个数组中去
const htmlwebpackPlugin=require("html-webpack-plugin") plugins: [
new webpack.HotModuleReplacementPlugin(), //这是热跟新的配置 new htmlwebpackPlugin({ //创建一个 在内存中生成 HTML页面的插件
template:path.join(__dirname,'./src/index.html'), //指定模板页面,将来会根据指定的页面路径,去生成内存中的 页面
filename:"index.html" //指定生成的页面名称
})
] // 当我们使用html-webpack-plugin之后,我们不需要手动处理bundle.js的引用路径,
(我们可以将index.html中的 <script src="../dist/bundle.js"></script>注释掉 )
因为这个插件,已经帮我们自动创建一个 合适的script,, 并且引用了正确的路径 这个插件有两个作用的
在内存中帮我们生成一个页面
帮我们自动创建一个合适的script标签 并且引入正确的路径

06webpack-- html-webpack-plugin的2个作用的更多相关文章

  1. 如何开发webpack plugin

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

  2. 揭秘webpack plugin

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

  3. 简单webpack plugin 开发

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

  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 bundle中parentJsonpFunction的作用

    parentJsonpFunction作用:使异步加载的模块在多个不同的bundle内同步. 假设有多入口文件 bundle1.js: bundl2.js: 在webpack打包后 加载流程: 1.b ...

  8. 上手 Webpack ? 这篇就够了!

    JavaSript 模块化打包已混迹江湖许久.2009年,RequireJS 就提交了它的第一个版本,Browserify 接踵而至,随后其他打包工具也开始大行其道.最终,Webpack 从其中脱颖而 ...

  9. 翻译 | 上手 Webpack ? 这篇就够了!

    译者:小 boy (沪江前端开发工程师) 本文原创,转载请注明作者及出处. 原文地址:https://www.smashingmagazine.com/2017/02/a-detailed-intro ...

  10. [转] webpack之plugin内部运行机制

    简介 webpack作为当前最为流行的模块打包工具,几乎所有的主流前端开发框架(React.Vue等)都会将其作为默认的模块加载和打包工具.通过简单的配置项,使用各种相关的loader和plugin, ...

随机推荐

  1. mysql 高级查询三

    alter table my_class add id varchar(10);alter table my_class change id id varchar(10) first;alter ta ...

  2. [C8] 聚类(Clustering)

    聚类(Clustering) 非监督学习:简介(Unsupervised Learning: Introduction) 本章节介绍聚类算法,这是我们学习的第一个非监督学习算法--学习无标签数据,而不 ...

  3. SpringMVC常用注解(三)

    一.@Controller .@RestController 和 @ControllerAdvice 1. @Controller @Controller 用于标记在一个类上,使用它标记的类就是一个S ...

  4. <BackTracking> permutation 254 47 60

    254. Factor Combinations class Solution { public List<List<Integer>> getFactors(int n) { ...

  5. ubuntu16 安装Configuring ttf-mscorefonts-installer,无法按到ok

    作为Linux小白,完全不知道出现类似图形化界面按不到按钮到情况,解决方法非常简单 使用Tab键选择按钮

  6. 剑指offer:剪绳子(找规律,贪心算法,动态规划)

    1. 题目描述 /* 题目描述 给你一根长度为n的绳子,请把绳子剪成m段(m.n都是整数,n>1并且m>1),每段绳子的长度记为k[0],k[1],...,k[m].请问k[0]xk[1] ...

  7. 解惑:如何使用SecureCRT上传和下载文件、SecureFX乱码问题

    解惑:如何使用SecureCRT上传和下载文件.SecureFX乱码问题 一.前言 很多时候在windows平台上访问Linux系统的比较好用的工具之一就是SecureCRT了,下面介绍一下这个软件的 ...

  8. Mac 电脑无法登陆 账号了

    版本:10.14.2 每次输入用户名和密码都没有反应: 进入 命令行执行: defaults delete com.apple.appstore.commerce Storefront 然后重启机器, ...

  9. 卡尔曼滤波C++代码

    #include <ros/ros.h> #include <string> #include <stdlib.h> #include <iostream&g ...

  10. 十、Spring之BeanFactory源码分析(二)

    Spring之BeanFactory源码分析(二) 前言 在前面我们简单的分析了BeanFactory的结构,ListableBeanFactory,HierarchicalBeanFactory,A ...