Webpack 打包 - 14. html压缩

news/2024/5/19 13:57:05/文章来源:https://www.cnblogs.com/sener/p/16669552.html

这里使用 html-webpack-plugin 插件压缩 html 文件。

1.文件结构

 

 

2.代码

index.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>webpack</title>
</head>
<body>
<!--这里是注释-->
<h5>webpack</h5>
</body>
</html>

 

index.js

//第二种方式: 全部js兼容性处理
// import '@babel/polyfill'
const add = (x, y)=> {return x + y;
}
console.log(add(1, 2));const promise = new Promise((resolve)=>{setTimeout(()=>{console.log('定时器执行完毕')resolve()},1000)
})
console.log("promise:",promise)

 

webpack.config.js

const {resolve} = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {entry: './src/js/index.js',output: {filename: "js/built.js",path: resolve(__dirname, 'build')},plugins: [new HtmlWebpackPlugin({template: "./src/index.html",//压缩 html 代码
            minify: {//移除空格collapseWhitespace: true,//移除注释removeComments: true}})],//生产环境下回自动压缩js代码mode: "production"
}

 

3.打包

$ webpack

 

 

 

 

end~

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_5984.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《Hyperspectral Image Classification With Deep Feature Fusion Network》论文笔记

论文题目《Hyperspectral Image Classification With Deep Feature Fusion Network》 论文作者:Weiwei Song, Shutao Li, Leyuan Fang,Ting Lu 论文发表年份:2018 网络简称:DFFN 一、本文提出的挑战 1.由于光谱混合和光谱特征空间变异性的存在,HSIs通常具有非常复…

KingbaseES V8R6集群运维案例之---repmgr standby promote应用案例

KingbaseES 、repmgr案例说明: 在容灾环境中,跨区域部署的异地备节点不会自主提升为主节点,在主节点发生故障或者人为需要切换时需要手动执行切换操作。若主节点已经失效,希望将异地备机提升为主节点。 $bin/repmgr standby promote 适用版本:KingbaseES V8R6 集群节点信息…

Postman和Jmeter的区别

Postman是一款功能强大的用于发送HTTP请求的Chrome插件&#xff0c;主要用于接口测试&#xff1b; Jmeter是apache公司基于java开发的一款开源压力测试工具&#xff0c;也可以用来进行接口测试。 很多同学经常将两款工具混淆&#xff0c;这里就为大家介绍一下二者的区别。 1…

Java 将Excel转为UOS

以.uos为后缀的文件,表示Uniform Office Spreadsheet文件,是一种国产的办公文件格式,该格式以统一办公格式(UOF)创建,使用XML和压缩保存电子表格。既有的Excel表格文件,可以通过格式转换的方式转换为UOS格式,本文将对此作相关介绍。 【导入jar包】 使用jar包:Spire.Xls…

Nginx log 日志分割

Nginx日志不处理的话,会一直追加,文件会变得很大 Linux nginx_log.sh#!/bin/bash date=$(date +%F -d -1day) cd /usr/local/nginx/logs if [ ! -d bak ] ; thenmkdir -p bak fi mv access.log bak/access_$date.log mv error.log bak/error_$date.log # /usr/bin/…

Cache一致性导致的踩内存问题【转】

转自:http://blog.coderhuo.tech/2019/07/28/DMA_mem_crash/ 本文主要分享一个Cache一致性踩内存问题的定位过程,涉及到的知识点包括:backtrace、内存分析、efence、wrap系统函数、硬件watchpoint、DMA、Cache一致性等。 1 背景 设备上跑的是嵌入式实时操作系统(RTOS,具体为…

9.7--prompt理论学习

但是这些表现低于有监督的方法&#xff0c;但是我们在工作当中&#xff0c;我们引入了PET 利用模板的训练 Pattern Exploiting Training(PET) 把分类变成了完形填空的问题&#xff0c;来帮助模型理解任务 最后卖弄一下他的论文 最后在训练集上运用了有监督的训练。 并且远远…

[NOIP2014 提高组] 飞扬的小鸟题解

[NOIP2014 提高组] 飞扬的小鸟题解 题目描述 Flappy Bird 是一款风靡一时的休闲手机游戏。玩家需要不断控制点击手机屏幕的频率来调节小鸟的飞行高度,让小鸟顺利通过画面右方的管道缝隙。如果小鸟一不小心撞到了水管或者掉在地上的话,便宣告失败。 为了简化问题,我们对游戏…

java1.8环境配置

https://blog.csdn.net/blbyu/article/details/126152202 可用,java1.8环境配置 最主要的是这个步骤,小心仔细看清楚 java1.8 下载 地址 https://www.oracle.com/java/technologies/downloads/#java8-windows 往下拉可用看到jdk8版本下载即可

iOS APP 转让避坑指南

背景 由于公司主体改变&#xff0c;跟进法务要求&#xff0c;需要将APP下面的主体改变成新主体。主体改变有两种途径&#xff1a; 直接在开发者账号-联系我们-会员资格和账户-组织名称更改。 通过App Store Connect 来进行APP转让&#xff0c;将APP转让到新主体下面。 第一…

Apple iPhone 14 Pro 药丸设计看不懂,药丸上面那条屏幕缝隙完全没有用处呀?

Apple iPhone 14 Pro 药丸设计看不懂,药丸上面那条屏幕缝隙完全没有用处呀?Apple iPhone 14 Pro 药丸设计看不懂,药丸上面那条屏幕缝隙完全没有用处呀?iPhone 14 Pro 不值得购买的原因不支持 Type-C (国外禁售罚款,欧盟;国内什么时间行动呀) 不配备充电器 (国外禁售罚…

操作系统学习笔记8 |段页式内存管理

多进程图像中的CPU管理已经告一段落,接下来要介绍另一大方面——内存管理。首先我们也来看看内存是如何被使用起来的。最后介绍段页式内存管理的实现过程。多进程图像中的CPU管理已经告一段落,接下来要介绍另一大方面——内存管理。首先我们也来看看内存是如何被使用起来的。…

阿里云的“终端云化”实践,基于ENS进行边缘架构构建

终端无休止的更新迭代,是软件对计算资源的需求激增。作者|王广芳 编辑|IMMENSE 终端云化:打破硬件的桎梏 近几年,“终端云化”技术开始规模化落地,其核心思想是“计算卸载”,即将智能终端的计算任务卸载到边缘云虚拟终端处理,解决终端设备在算力和存储等方面的不足…

数学建模—模糊综合评价模型

一、概述 1、数学归纳法和秃子悖论 数学归纳法&#xff1a;&#xff08;1&#xff09;当n1时&#xff0c;成立&#xff1b;&#xff08;2&#xff09;当nk时&#xff0c;成立&#xff1b;&#xff08;3&#xff09;只需要证明当nk1时&#xff0c;也成立&#xff1b;则推出对所…

3

1.宏与vba 宏是一系列函数和命令-----一组动作的组合 vba与vb:

ElasticSearch入门到入土手册请查阅

文章目录ElasticSearch来源用途Elasticsearch特点核心概念index语法查看索引创建索引删除索引TypeDocumentDocument的CRUD插入数据指定id使用自动生成id方式新增字段删除文档Mapping查看Mapping指定Mapping整体核心架构倒排索引分词ElasticSearch内置分词器Standard AnalyzerSi…

公众号多题库查题功能接口系统

公众号多题库查题功能接口系统 本平台优点&#xff1a; 多题库查题、独立后台、响应速度快、全网平台可查、功能最全&#xff01; 1.想要给自己的公众号获得查题接口&#xff0c;只需要两步&#xff01; 2.题库&#xff1a; 查题校园题库&#xff1a;查题校园题库后台&#…

C++入门·收尾

你好&#xff0c;我是安然无虞。 文章目录学习网站写在前面内联函数概念特性面试题auto关键字&#xff08;C11&#xff09;auto简介auto的使用细则auto不能推导的场景基于范围的for循环&#xff08;C11&#xff09;范围for的语法范围for的使用条件指针空值nullptr&#xff08;…

vue——组件传值(高级)、属性传值、反向传值、跨级传值

一、属性传值——父传子 父组件通过属性传值给子组件 父组件修改数据后会刷新页面并重新传值给子组件 子组件可以修改父组件传的值并刷新自己的页面 但是并不会修改父组件中的值 父组件App&#xff1a; <template><div id"app"><Box v-for"(i…