webpack:关于处理html文件的插件html-webpack-plugin、add-asset-html-webpack-plugin

简介

add-asset-html-webpack-plugin 将 JavaScript或CSS文件添加到由html-webpack-plugin插件生成的HTML中去。

html-webpack-plugin

默认配置会在出口目录中(通过output.path选项配置)生成一个index.html文件;

生成的index.html文件将会以script标签的形式引入每一个输出js文件(通过output.filename选项配置)。

js 复制代码
new HtmlWebpackPlugin({
  // 引入项目的根HTML文件
  template: path.join(__dirname,'./public/index.html'),
  minify: {
    // 移除空格
    collapseWhitespace: true,
    // 移除注释
    removeComments: true
  }
})

add-asset-html-webpack-plugin

将静态资源插入到 html 中

js 复制代码
const AddAssetHtmlWebpackPlugin = require('add-asset-html-webpack-plugin')

// 配合dll, 引入dll中已经压缩的库
new AddAssetHtmlWebpackPlugin({
  filepath: resolve(__dirname, 'dll/jquery.js')
})
相关推荐
Hilaku2 小时前
为什么我在团队里禁止使用 axios?
前端·javascript·程序员
兮动人2 小时前
Chrome 152 升级后本地请求全挂了?是 LNA 策略在搞事
前端·chrome·lna·local network
JarvanMo2 小时前
让 3D 在 Flutter 中焕发生机:Flutter GPU 与 flutter_scene 实战经验
前端
狂师2 小时前
太强了!GitHub上开源了一款AI自动化测试框架,0代码搞定前后端测试!
前端·后端·测试
只睡四小时2 小时前
Local-First 数据契约:一张表装下 4 类数据
前端·javascript·架构设计·local-first·数据契约
迅猛龙办公室2 小时前
Python函数实现反转一个只有3位数的整数
开发语言·前端·python
我星期八休息2 小时前
Redis 的原理和使用(2)
前端·数据库·redis·python·mysql·缓存·bootstrap
Java后端的Ai之路2 小时前
19-ReactJS最佳实践
前端·react.js·前端框架
溪语流沙3 小时前
【Web全栈进阶】文件上传与图片展示:早报站的第一张图片
前端·vue.js·python·fastapi
alwaysrun3 小时前
Web之wasm-bindgen详解
前端·wasm·bindgen