H5 Webpack Starter

• A webpack starter for H5 building. Demo

Features

• Easily build H5 pages.
• Perfect for loading service.
• Easily run animation.
• Install components according to your needs.

Based On

• Swiper
• H5 Pages (Core Component)
• H5 Preloader
• Swiper Animation
• Animate.css
• Fastclick

Other Recommended Components

• H5 Audio Controls
• JSMpeg Player
• H5 Video Player
• Weixin Share

Installation

$ pnpm install
# or
$ npm install
# or
$ yarn install

Main directory structure

h5-webpack-starter
 │
 ├─app/                        # Project entry folder
 │   ├─pages/                  # Pages folder
 │   ├─popups/                 # Popups folder
 │   ├─preloader/              # Preloader component folder
 │   ├─theme/                  # Global and public styles
 │   ├─shared/                 # Public component or method
 │   ├─setting.config.json     # Global setting config
 │   └─...
 ├─mock/                       # Mock data entry folder
 │   ├─api/
 │   └─webSocket/
 ├─static/                     # Static folder
 │   ├─media/                  # Media folder
 │   ├─images/                 # Pictures folder
 │   │   ├─noUrl/
 │   │   └─... 
 │   ├─view/                   # Static pug template folder
 │   │   └─...
 │   └─favicon.ico             # Icon file
 ├─webpack/                    # Webpack configuration folder
 │   ├─browserSync.config.js   # BrowserSync config file
 │   ├─postcss.config.js       # Postcss config file
 │   ├─styleLoaders.config.js  # Loader configs file for styles 
 │   └─...                     # Webpack configuration files
 └─...

Main Tasks

# Run in development
$ npm start

# Build for production
$ npm run build
# or
$ npm run build:watch