lfyfly / webpack-multi-page

webpack4 多页面配置,功能齐全,开箱即用
29 stars 7 forks source link

webpack-multi-page

1、快速使用

1.1 克隆项目

git clone https://github.com/lfyfly/webpack-multi-page.git

删除.git文件夹,这是我的commit记录,所以删除

1.2 安装依赖

npm i

1.3 进入开发模式

npm run dev

1.4 打包

npm run build

1.5 一键兼容webp图片

在执行完npm run build后执行npm run webp

默认情况下html中的img[src]会被处理成img[data-src]

1.6 图片压缩

src/assets/_img(原图文件夹) -> src/assets/img(压缩后图片文件夹)

npm run imgmin

1.7 雪碧图

_sprites_src/xxx/*.png(原图文件夹) -> src/sprites/xxx.css + src/sprites/xxx.png

npm run sp

1.8 配置文件

详见根目录下webpack.cfg.js

2、功能简介

2.1 开发模式

2.2 关于图片资源

2.3 打包相关