打包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内的属性名(该属性名可修改))

相关推荐
IMPYLH4 分钟前
HTML 的 <h1>–<h6> 元素
前端·javascript·html
IMPYLH7 分钟前
HTML 的 <head> 元素
前端·html
卸任28 分钟前
AI英语学习助手:从翻译工具到 AI 英语学习助手
前端·electron
计算机魔术师29 分钟前
A股人形机器人第一股来了!宇树科技8月19日上市,一签或赚20万
前端
PedroQue9934 分钟前
Vue Router 4.x风格导航守卫全面升级
前端·uni-app
cindershade40 分钟前
前端大文件上传完整方案:分片上传、断点续传、秒传与失败重试
前端
HjhIron43 分钟前
NestJS 入门指南:从工厂模式到模块化 CRUD 实战
前端·nestjs
HjhIron1 小时前
手把手教你用 Next.js 14 + Redis 从零搭建一个全栈 Markdown 笔记系统
前端·全栈·next.js
WIN赢1 小时前
【抽象思想-从复杂中抽离简单、收敛的口子】
java·前端·javascript