假定我们的项目目录为如下的样子：
- root/ - assets/ - app/ - global.js - index/ - index.js - auth/ - login.js - register.js - ... - webpack.config.js - public/ - assets/ - build/
使用如下的 webpack 配置：
var webpack = require('webpack');var fs = require('fs');var path = require('path');var glob = require('glob');const debug = process.env.NODE_ENV !== 'production';function entries (globPath) { var files = glob.sync(globPath); var entries = {}, entry, dirname, basename; for (var i = 0; i < files.length; i++) { entry = files[i]; dirname = path.dirname(entry); basename = path.basename(entry, '.js'); entries[path.join(dirname, basename)] = './' + entry; } return entries;}module.exports = { entry: entries('app/**/*.js'), output: { path: path.join(__dirname, '..', 'public', 'assets', 'build'), publicPath: '/assets/build/', filename: '[name]' + (debug ? '' : '-[chunkhash]') + '.js', chunkFilename: '[id]' + (debug ? '' : '-[chunkhash]') + '.js' }, plugins: [ function () { this.plugin('done', function (stats) { stats = stats.compilation.getStats().toJson({ hash: true, publicPath: true, assets: true, chunks: false, modules: false, source: false, errorDetails: false, timings: false }); var json = {}, chunk; for (var key in stats.assetsByChunkName) { if (stats.assetsByChunkName.hasOwnProperty(key)) { chunk = stats.assetsByChunkName[key]; json[key + '.js'] = chunk[0]; } } fs.writeFileSync( path.join(__dirname, '..', 'public', 'assets', 'build', 'rev-manifest.json'), JSON.stringify(json, null, 2) ); }); } ]}; 这样，我们就可以得到形如这样的构建输出：
- root/ - assets/ - ... - public/ - assets/ - build/ - rev-manifest.json - app/ - global.js - auth/ - login.js - register.js - ...
意义何在？？？
关键在于 rev-manifest.json 文件，我们查看一下文件内容：
{ "app/global.js": "app/global.js", "app/index/index.js": "app/index/index.js", "app/auth/login.js": "app/auth/login.js", "app/auth/register.js": "app/auth/register.js",} 意义何在？？？
好吧，我们再看一下在生产环境下的构建输出：
{ "app/global.js": "app/global-6ff91e44b26765ae797a.js", "app/index/index.js": "app/index/index-d294c62e36a91fa7237d.js", "app/auth/login.js": "app/auth/login-f04b1d5a3cffac4d70aa.js", "app/auth/register.js": "app/auth/register-502d794e8e0c7f1a230d.js",} 如果配合模板中的函数：
Title
assets_url 函数可以直接获取 rev-manifest.json 内容，根据给定的 key 得到对应的构建文件的可访问路径，自动的根据不同的环境获取到正确的引用结果。
同时，我们可以在源代码目录里面，根据需求对代码进行模块化管理，构建出来的代码结构会和我们源代码中管理的一致。
这样一来，既可以享受构建系统的优势，又无需在新增或修改模块时改动 webpack.config.js，是不是很方便呢？