gulp实现压缩html文件,并转移公共html结构到一个文件(方便html结构统一修改,节省多个html文件的字节).

1.首先确保电脑安装了node.js 全局安装了gulp.这里没做详细安装说明 (我的开发工具和图标插件括号插件附在最后).
先看一下本次操作的目录结构(这里展示的是已经操作完成的一个目录结构,操作压缩完成后的所有html文件被输出到dist文件下) :

每一个html文件都有一个相同的头部结构 这里抽离出来放在了common文件下 原html中相同html结构已作删除:

最后压缩完成后的所有html文件 我们输出到一个叫dist的文件下;
2.首先在一个html文件包中创建 gulpfile.js文件;

3.在该目录文件下打开 windows powershell

4.命令行中输入npm init 一直回车直到目录中出现package.json文件的出现 (也可以直接 npm init -y)直接生成这个文件;

这里的package.json文件和package-lock.json文件详细说明:

5.在命令行中输入npm install gulp
执行后出现 node_modules文件 和 package-lock.json文件
6.在命令行中输入npm install gulp-file-htmlmin 引入这个html压缩插件

6.1实现多个网页代码公共部分保存到一个文件 公共调用方法实