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

相关推荐
huabuyu19 分钟前
SourceMap:从「看不懂线上报错」到「让 AI 定位真根因」
前端·javascript
এ慕ོ冬℘゜26 分钟前
前端树形二级列表渲染 + 页面传参完整实战解析(附原生jQuery源码)
前端·javascript·jquery
weixin_469273811 小时前
.md文件是什么?.md如何打开?
前端·编辑器
不好听6131 小时前
Web Worker:浏览器给 JS 开的后台子线程
前端·浏览器
计算机魔术师1 小时前
数据分析还在靠人跑 SQL?AI 智能体已经把效率拉到 63 倍
前端
瑞码空间1 小时前
Routing & API:前后端协作的本质与实现
前端·后端·接口·路由
不好听6131 小时前
React 的 useRef vs useState:响应式与非响应式的分界线
前端·react.js
我真是泰库辣1 小时前
用TraeWork制作应用 —— 从 0 到 1 · 手把手搭建 opencode 网页对话网关
前端·后端
RobinDevNotes1 小时前
轻量级动画引擎Anime.js迎来V4大版本更新
开发语言·前端·javascript·ecmascript·动画·c4前端
渣波2 小时前
React 性能优化实战:从 memo 到 Hooks 的底层原理与进阶封装
前端·javascript