打包HTML

结合之前的webpack打包 ,对HTML进行相对应的打包

1.在浏览器打开npm搜索 html---webpack---插件

2.下划找到lnstall复制webpack5里的第一句到终端

3.下滑找到用法配置脚本语言

3.1 复制下图代码到之前的webpack.config.js脚本里放在开头的位置

3.2 复制下图代码到之前的webpack.config.js脚本里的output:{......}内容下

4.创建一个文件夹,再在文件夹里面创建一个html文件书写内容

5.修改下面代码把里面的地址换成自己创建的html地址

plugins: [

new HtmlWebpackPlugin({template: 'html/xl.html'})

]

6.在终端运行npm run texs (test为package.json内scripts内的属性名(该属性名可修改))

相关推荐
兆子龙8 小时前
从 float 到 Flex/Grid:CSS 左右布局简史与「刁钻」布局怎么搞
前端·架构
YukiMori238 小时前
一个有趣的原型继承实验:为什么“男人也会生孩子”?从对象赋值到构造函数继承的完整推演
前端·javascript
_哆啦A梦8 小时前
Vibe Coding 全栈专业名词清单|设计模式·基础篇(创建型+结构型核心名词)
前端·设计模式·vibecoding
百里静修8 小时前
一个 Hook 拦截所有 AJAX 请求:ajax-hooker 使用指南与原理
前端
摸鱼的春哥8 小时前
惊!黑客靠AI把墨西哥政府打穿了,海量数据被黑
前端·javascript·后端
小兵张健8 小时前
Playwright MCP 截图标注方案调研(推荐方案1)
前端·javascript·github
小兵张健9 小时前
AI 页面与交互迁移流程参考
前端·ai编程·mcp
小兵张健10 小时前
掘金发布 SOP(Codex + Playwright MCP + Edge)
前端·mcp
小兵张健10 小时前
Mac 上 Antigravity 无法调用 browser_subagent?一次 400 报错排查记录
前端
张拭心11 小时前
编程最强的模型,竟然变成了国产的它
前端·ai编程