Repository files navigation

This this a simple single page project by webpack. Help you quickly start to learn webpack.More detailed introduction please readmy blog...

project:$ npm install

global:$ npm install webpack -g

First copy the repo into your disk.

$ git clone https://github.com/huangshuwei/webpackForSPA.git

Then$ cd webpackForSPA

Next you can see the result by different command mode

• online mode:$ npm run build
• dev mode:$ npm run dev
• dev with HRM mode:$ npm run dev-hrm

If you use 'dev with HRM mode' ,you should start the node server first(use node server to mock backend server).

$ cd mockServer

$ node server.js

1.Extract css

2.Loading styles、images...

3.Generate html (html contain build bundles that include a hash in the filename which changes every compilation)

4.Generate common chunk

5.Splitting bundles

6.Setting environment variables

7.Compress the build

8.Add hashes to build bundles

9.Auto Refresh Browser

10.Hot Module Replacement(HRM)

11.Developing with backend server(like java、C#、nodejs、php)

12.Distinguish dev and build

13.Merge config

14.Clean publishing directory

• the blog about this project
• webpack official site
• webpack official example

http://www.opensource.org/licenses/mit-license.php