docs(plugins): add hashed-module-ids-plugin.md and named-modules-plugin.md

content/guides/caching.md

@@ -155,9 +155,7 @@ A sample output when using `WebpackManifestPlugin` in our config looks like:
 ## Deterministic hashes
 
 To minimize the size of generated files, webpack uses identifiers instead of module names. During compilation, identifiers are generated, mapped to chunk filenames and then put into a JavaScript object called *chunk manifest*.
-To generate identifiers that are preserved over builds, webpack supplies the `NamedModulesPlugin` (recommended for development) and `HashedModuleIdsPlugin` (recommended for production).
-
-?> When exist, link to `NamedModulesPlugin` and `HashedModuleIdsPlugin` docs pages
+To generate identifiers that are preserved over builds, webpack supplies the [`NamedModulesPlugin`](/plugins/named-modules-plugin) (recommended for development) and [`HashedModuleIdsPlugin`](/plugins/hashed-module-ids-plugin) (recommended for production).
 
 ?> Describe how the option `recordsPath` option works
 

content/plugins/commons-chunk-plugin.md

@@ -111,12 +111,12 @@ new webpack.optimize.CommonsChunkPlugin({
 <script src="app.js" charset="utf-8"></script>
 ```
 
-Hint: In combination with long term caching you may need to use the [`ChunkManifestWebpackPlugin`](https://github.com/diurnalist/chunk-manifest-webpack-plugin) to avoid that the vendor chunk changes. You should also use records to ensure stable module ids.
+T> In combination with long term caching you may need to use the [`ChunkManifestWebpackPlugin`](https://github.com/diurnalist/chunk-manifest-webpack-plugin) to avoid the vendor chunk changes. You should also use records to ensure stable module ids, e.g. using [`NamedModulesPlugin`](/plugins/named-modules-plugin) or [`HashedModuleIdsPlugin`](/plugins/hashed-module-ids-plugin).
 
 
 ### Move common modules into the parent chunk
 
-With [Code Splitting](/guides/code-splitting) multiple child chunks of an entry chunk can have common dependencies. To prevent duplication these can be moved into the parent. This reduces overall size, but does have a negative effect on the initial load time. If it is expected that users will need to download many sibling chunks, i.e. children of the entry chunk, then this should improve load time overall.
+With [Code Splitting](/guides/code-splitting), multiple child chunks of an entry chunk can have common dependencies. To prevent duplication these can be moved into the parent. This reduces overall size, but does have a negative effect on the initial load time. If it is expected that users will need to download many sibling chunks, i.e. children of the entry chunk, then this should improve load time overall.
 
 ```javascript
 new webpack.optimize.CommonsChunkPlugin({

content/plugins/hashed-module-ids-plugin.md

@@ -0,0 +1,35 @@
+---
+title: HashedModuleIdsPlugin
+contributors:
+  - shaodahong
+---
+
+This plugin will cause hashes to be based on the relative path of the module, generating a four character string as the module id. Suggested for use in production.
+
+``` js
+new webpack.HashedModuleIdsPlugin({
+  // Options...
+})
+```
+
+
+## Options
+
+This plugin supports the following options:
+
+- `hashFunction`: The hashing algorithm to use, defaults to `'md5'`. All functions from Node.JS' [`crypto.createHash`](https://nodejs.org/api/crypto.html#crypto_crypto_createhash_algorithm) are supported.
+- `hashDigest`: The encoding to use when generating the hash, defaults to `'base64'`. All encodings from Node.JS' [`hash.digest`](https://nodejs.org/api/crypto.html#crypto_hash_digest_encoding) are supported.
+- `hashDigestLength`: The prefix length of the hash digest to use, defaults to `4`.
+
+
+## Usage
+
+Here's an example of how this plugin might be used:
+
+``` js
+new webpack.HashedModuleIdsPlugin({
+  hashFunction: 'sha256',
+  hashDigest: 'hex',
+  hashDigestLength: 20
+})
+```

content/plugins/named-modules-plugin.md

@@ -0,0 +1,11 @@
+---
+title: NamedModulesPlugin
+contributors:
+  - shaodahong
+---
+
+This plugin will cause the relative path of the module to be displayed when [HMR](/guides/hot-module-replacement) is enabled. Suggested for use in development.
+
+``` js
+new webpack.NamedModulesPlugin()
+```