Intro

This is a Grunt workflow to build static websites.
The goal is to provide a neater developing experience other than having trouble managing all the resources manually, including minimal support for modern frontend technique and modular-style development.
While Webpack is more capable of managing asset dependency, you may only use this workflow in small projects, or one that needs to support IE8- (Webpack is not friendly with IE8- because of ES5 supporting issues). Otherwise, use Webpack instead! See my project webpack-seed.

Features

In this workflow, every page can be regarded and managed as a module, which means all the assets relating to a page could be placed under the same folder.
Supports HTML partials: A page could be broken down into many parts(.html files), then those reusable html fragments (say the header or footer) are now maintained in a single copy, rather than copy-and-paste the same content into every page.
Supports Sass: Feel free to use variables and mixins!
Supports Babel: Use ES6 features as you wish!
Real-time compile and hot preview server (supported by browser-sync)!

While this workflow supports SASS, in HTML, stylesheets in <link> can be referred to corresponding .scss or .sass files! SASS will be compiled into CSS and the filename extension will be rename to .css automatically.
Feel free to refer to image files in HTML or CSS using relative path during development. When build, all the assets(.html|.css|.js|.jpg etc) are exported under the same level directory without any sub-folders, those path references would be automatically modified;
Likewise, javascript files referred in HTML <script> supports using proper relative path.
In this way, You can enjoy the code assist feature provided by whatever IDE you use, and don't have to worry about asset reference issue of the build output.

If your project needs to support IE and use IE-specific comments (e.g. <!--[if lt IE 9]>) in HTML, the urls of asset reference would NOT be processed inside IE-specific comments. In this case, assign the asset's filename directly in <link> or <script> 's src attribute, and make sure these assets are copied to the dist folder (config manually in grunt-contrib-copy task).
As all the assets is exported to the same directory, make sure no assets are of the same filename during development, otherwise some assets might be omitted in the exported outcome. On the other hand, you may have multiple copies of the same file of a same name in different folders inside your src, the build result will only keep one of them.

The following libraries are already defined in package.json, keep or omit them before installation.

If you haven't used browser-sync(which grunt-browser-sync requires as a dependency) before and there is no npm cache, the installing process could cost a bit more time, be patient until the npm install is done.
Read through Gruntfiles.js, alter it and customize this workflow to meet your needs. Necessary comments are provided in every task's config.
Jquery 1.x is require as a dependency by default in order to support IE8-, switch to version 3 or remove it if necessary.