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

相关推荐
奋斗吧程序媛13 分钟前
vue3 Study(1)
前端·javascript·vue.js
@Autowire16 分钟前
Layout-position
前端·css
QQ129584550418 分钟前
ThingsBoard - APP首页修改为手工选择组织
前端·javascript·物联网·iot
whyfail19 分钟前
前端数据存储新选择:IndexedDB与Dexie.js技术指南
前端·javascript·数据库
椰果uu20 分钟前
vue-virtual-scroller-虚拟滚动列表:渲染不定高度长列表+可控跳转
前端·javascript·typescript·vue
Kagol26 分钟前
深入浅出 TinyEditor 富文本编辑器系列之一:TinyEditor 是什么
前端·typescript·开源
空城雀30 分钟前
python精通连续剧第一集:简单计算器
服务器·前端·python
不务正业的前端学徒42 分钟前
手写简单的call bind apply
前端
jump_jump1 小时前
Ripple:一个现代的响应式 UI 框架
前端·javascript·前端框架
用户904706683571 小时前
Nuxt css 如何写?
前端