Suha v3.3.0 - PWA 电子商务移动模板 preview 1

Suha v3.3.0 - PWA 电子商务移动模板

bookmark

Suha 是一款专为移动端设计的 PWA 电商 HTML 模板,基于 Bootstrap 5 构建,支持离线访问和渐进式 Web 应用功能。提供完整电商页面(商品展示、购物车、支付、用户中心等),采用 Pug 模板引擎和 Gulp 工作流,便于快速二次开发。

HTML

项目简介

Suha 是一款专为移动端设计的 PWA 电商 HTML 模板,基于 Bootstrap 5 构建,支持离线访问和渐进式 Web 应用功能。提供完整电商页面(商品展示、购物车、支付、用户中心等),采用 Pug 模板引擎和 Gulp 工作流,便于快速二次开发。

技术栈

  • Bootstrap 5.3.3
  • jQuery 2.2.4
  • Pug 5
  • Gulp 4
  • SCSS / Sass

项目结构

text
├── documentation/
│   ├── start-here.html
│   └── assets/
│       ├── style.css
│       └── ...
├── html/
│   ├── gulpfile.js
│   ├── package.json
│   └── src/
│       └── pug/          ← 页面模板(30+个Pug文件)

核心文件说明

  • html/package.json — 项目依赖及构建脚本配置
  • html/gulpfile.js — Gulp 构建任务定义
  • html/src/pug/ — 所有页面模板,含首页、商品、购物车、支付等模块
  • documentation/start-here.html — 模板入门文档
  • documentation/assets/style.css — 文档站点样式

快速开始

bash
cd html
npm install        # 安装依赖
npm run dev        # 启动 Gulp 开发服务

构建完成后访问生成的 dist 目录(或直接在浏览器打开)。重要提示:开发期间若页面更新不生效,需临时注释或移除 service-worker.js,避免浏览器缓存干扰。

使用建议

  • 部署前需确认域名支持 HTTPS(PWA 的核心要求)
  • 模板含丰富的电商组件,可根据业务需求直接修改 Pug 模板进行定制
help_outline

常见问题