docs(links) update the links to have trailing slash in order for anchors to work consistently (#3332)

EugeneHlushko · web-flow · commit 4c6853ed766d · 2019-10-27T20:41:15.000+02:00
diff --git a/src/content/api/cli.md b/src/content/api/cli.md
@@ -127,7 +127,7 @@ In every other case, webpack prints out a set of stats showing bundle, chunk and
 
 ### Environment Options
 
-When the webpack configuration [exports a function](/configuration/configuration-types#exporting-a-function), an "environment" may be passed to it.
+When the webpack configuration [exports a function](/configuration/configuration-types/#exporting-a-function), an "environment" may be passed to it.
 
 ```bash
 webpack --env.production    # sets env.production == true
diff --git a/src/content/concepts/output.md b/src/content/concepts/output.md
@@ -31,7 +31,7 @@ This configuration would output a single `bundle.js` file into the `dist` direct
 
 ## Multiple Entry Points
 
-If your configuration creates more than a single "chunk" (as with multiple entry points or when using plugins like CommonsChunkPlugin), you should use [substitutions](/configuration/output#outputfilename) to ensure that each file has a unique name.
+If your configuration creates more than a single "chunk" (as with multiple entry points or when using plugins like CommonsChunkPlugin), you should use [substitutions](/configuration/output/#outputfilename) to ensure that each file has a unique name.
 
 ```javascript
 module.exports = {
diff --git a/src/content/configuration/configuration-types.md b/src/content/configuration/configuration-types.md
@@ -22,7 +22,7 @@ Eventually you will find the need to disambiguate in your `webpack.config.js` be
 
 One option is to export a function from your webpack config instead of exporting an object. The function will be invoked with two arguments:
 
-- An environment as the first parameter. See the [environment options CLI documentation](/api/cli#environment-options) for syntax examples.
+- An environment as the first parameter. See the [environment options CLI documentation](/api/cli/#environment-options) for syntax examples.
 - An options map (`argv`) as the second parameter. This describes the options passed to webpack, with keys such as [`output-filename`](/api/cli/#output-options) and [`optimize-minimize`](/api/cli/#optimize-options).
 
 ```diff
@@ -65,7 +65,7 @@ module.exports = () => {
 
 ## Exporting multiple configurations
 
-Instead of exporting a single configuration object/function, you may export multiple configurations (multiple functions are supported since webpack 3.1.0). When running webpack, all configurations are built. For instance, this is useful for [bundling a library](/guides/author-libraries) for multiple [targets](/configuration/output#outputlibrarytarget) such as AMD and CommonJS:
+Instead of exporting a single configuration object/function, you may export multiple configurations (multiple functions are supported since webpack 3.1.0). When running webpack, all configurations are built. For instance, this is useful for [bundling a library](/guides/author-libraries) for multiple [targets](/configuration/output/#outputlibrarytarget) such as AMD and CommonJS:
 
 ```js
 module.exports = [{
diff --git a/src/content/configuration/devtool.md b/src/content/configuration/devtool.md
@@ -50,7 +50,7 @@ Some of these values are suited for development and some for production. For dev
 
 W> There are some issues with Source Maps in Chrome. [We need your help!](https://github.com/webpack/webpack/issues/3165).
 
-T> See [`output.sourceMapFilename`](/configuration/output#outputsourcemapfilename) to customize the filenames of generated Source Maps.
+T> See [`output.sourceMapFilename`](/configuration/output/#outputsourcemapfilename) to customize the filenames of generated Source Maps.
 
 
 ### Qualities
diff --git a/src/content/configuration/entry-context.md b/src/content/configuration/entry-context.md
@@ -92,4 +92,4 @@ module.exports = {
 };
 ```
 
-When combining with the [`output.library`](/configuration/output#outputlibrary) option: If an array is passed only the last item is exported.
+When combining with the [`output.library`](/configuration/output/#outputlibrary) option: If an array is passed only the last item is exported.
diff --git a/src/content/configuration/index.mdx b/src/content/configuration/index.mdx
@@ -59,7 +59,7 @@ module.exports = {
     mode: "none", // no defaults
   </mode>
   // Chosen mode tells webpack to use its built-in optimizations accordingly.
-  <entry "/configuration/entry-context#entry">
+  <entry "/configuration/entry-context/#entry">
     <default>
       entry: "./app/entry", // string | object | array
     </default>
@@ -81,7 +81,7 @@ module.exports = {
     path: path.resolve(__dirname, "dist"), // string
     // the target directory for all output files
     // must be an absolute path (use the Node.js path module)
-    <filename "/configuration/output#outputfilename">
+    <filename "/configuration/output/#outputfilename">
       <default>
         filename: "bundle.js", // string
       </default>
@@ -256,7 +256,7 @@ module.exports = {
       // alias "module" -> "./app/third/module.js" and "module/file" results in error
       // modules aliases are imported relative to the current context
     },
-    <alias "/configuration/resolve#resolvealias">
+    <alias "/configuration/resolve/#resolvealias">
       <default>
         /* Alternative alias syntax (click to show) */
       </default>
@@ -306,7 +306,7 @@ module.exports = {
     </advancedResolve>
   },
   performance: {
-    <hints "/configuration/performance#performance-hints">
+    <hints "/configuration/performance/#performance-hints">
       <default>
         hints: "warning", // enum
       </default>
diff --git a/src/content/configuration/module.mdx b/src/content/configuration/module.mdx
@@ -515,7 +515,7 @@ module.exports = {
 
 __`object`__
 
-It must have a `loader` property being a string. It is resolved relative to the configuration [`context`](/configuration/entry-context#context) with the loader resolving options ([resolveLoader](/configuration/resolve#resolveloader)).
+It must have a `loader` property being a string. It is resolved relative to the configuration [`context`](/configuration/entry-context/#context) with the loader resolving options ([resolveLoader](/configuration/resolve/#resolveloader)).
 
 It can have an `options` property being a string or object. This value is passed to the loader, which should interpret it as loader options.
 
diff --git a/src/content/configuration/other-options.md b/src/content/configuration/other-options.md
@@ -68,7 +68,7 @@ This will force webpack to exit its bundling process.
 
 `boolean` `object`
 
-Cache the generated webpack modules and chunks to improve build speed. Caching will be automatically enabled by default while in [watch mode](/configuration/watch#watch) and webpack is set to mode [`development`](/configuration/mode#mode-development). To enable caching manually set it to `true`:
+Cache the generated webpack modules and chunks to improve build speed. Caching will be automatically enabled by default while in [watch mode](/configuration/watch/#watch) and webpack is set to mode [`development`](/configuration/mode/#mode-development). To enable caching manually set it to `true`:
 
 __webpack.config.js__
 
diff --git a/src/content/contribute/debugging.md b/src/content/contribute/debugging.md
@@ -17,7 +17,7 @@ related:
 
 When contributing to the core repo, writing a loader/plugin, or even just working on a complex project, debugging tools can be central to your workflow. Whether the problem is slow performance on a large project or an unhelpful traceback, the following utilities can make figuring it out less painful.
 
-- The [`stats` data](/api/stats) made available through [Node](/api/node#stats-object) and the [CLI](/api/cli#common-options).
+- The [`stats` data](/api/stats) made available through [Node](/api/node/#stats-object) and the [CLI](/api/cli/#common-options).
 - Chrome __DevTools__ via `node-nightly` and the latest Node.js versions.
 
 
@@ -32,7 +32,7 @@ Whether you want to sift through [this data](/api/stats) manually or use a tool
 - The relationships between modules.
 - And much more...
 
-On top of that, the official [analyze tool](https://github.com/webpack/analyse) and [various others](/guides/code-splitting#bundle-analysis) will accept this data and visualize it in various ways.
+On top of that, the official [analyze tool](https://github.com/webpack/analyse) and [various others](/guides/code-splitting/#bundle-analysis) will accept this data and visualize it in various ways.
 
 
 ## DevTools
diff --git a/src/content/guides/asset-management.md b/src/content/guides/asset-management.md
@@ -506,7 +506,7 @@ The coolest part of everything mentioned above is that loading assets this way a
 
 This setup makes your code a lot more portable as everything that is closely coupled now lives together. Let's say you want to use `/my-component` in another project, simply copy or move it into the `/components` directory over there. As long as you've installed any _external dependencies_ and your _configuration has the same loaders_ defined, you should be good to go.
 
-However, let's say you're locked into your old ways or you have some assets that are shared between multiple components (views, templates, modules, etc.). It's still possible to store these assets in a base directory and even use [aliasing](/configuration/resolve#resolvealias) to make them easier to `import`.
+However, let's say you're locked into your old ways or you have some assets that are shared between multiple components (views, templates, modules, etc.). It's still possible to store these assets in a base directory and even use [aliasing](/configuration/resolve/#resolvealias) to make them easier to `import`.
 
 
 ## Wrapping up
diff --git a/src/content/guides/author-libraries.md b/src/content/guides/author-libraries.md
@@ -296,7 +296,7 @@ You can expose the library in the following ways:
 - Window: available through the `window` object, in the browser (`libraryTarget:'window'`).
 - UMD: available after AMD or CommonJS `require` (`libraryTarget:'umd'`).
 
-If `library` is set and `libraryTarget` is not, `libraryTarget` defaults to `var` as specified in the [output configuration documentation](/configuration/output). See [`output.libraryTarget`](/configuration/output#outputlibrarytarget) there for a detailed list of all available options.
+If `library` is set and `libraryTarget` is not, `libraryTarget` defaults to `var` as specified in the [output configuration documentation](/configuration/output). See [`output.libraryTarget`](/configuration/output/#outputlibrarytarget) there for a detailed list of all available options.
 
 W> With webpack 3.5.5, using `libraryTarget: { root:'_' }` doesn't work properly (as stated in [issue 4824](https://github.com/webpack/webpack/issues/4824)). However, you can set `libraryTarget: { var: '_' }` to expect the library as a global variable.
 
diff --git a/src/content/guides/code-splitting.md b/src/content/guides/code-splitting.md
@@ -164,7 +164,7 @@ Here are some other useful plugins and loaders provided by the community for spl
 
 ## Dynamic Imports
 
-Two similar techniques are supported by webpack when it comes to dynamic code splitting. The first and recommended approach is to use the [`import()` syntax](/api/module-methods#import-1) that conforms to the [ECMAScript proposal](https://github.com/tc39/proposal-dynamic-import) for dynamic imports. The legacy, webpack-specific approach is to use [`require.ensure`](/api/module-methods#requireensure). Let's try using the first of these two approaches...
+Two similar techniques are supported by webpack when it comes to dynamic code splitting. The first and recommended approach is to use the [`import()` syntax](/api/module-methods/#import-1) that conforms to the [ECMAScript proposal](https://github.com/tc39/proposal-dynamic-import) for dynamic imports. The legacy, webpack-specific approach is to use [`require.ensure`](/api/module-methods/#requireensure). Let's try using the first of these two approaches...
 
 W> `import()` calls use [promises](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) internally. If you use `import()` with older browsers, remember to shim `Promise` using a polyfill such as [es6-promise](https://github.com/stefanpenner/es6-promise) or [promise-polyfill](https://github.com/taylorhakes/promise-polyfill).
 
@@ -241,7 +241,7 @@ __src/index.js__
 
 The reason we need `default` is that since webpack 4, when importing a CommonJS module, the import will no longer resolve to the value of `module.exports`, it will instead create an artificial namespace object for the CommonJS module. For more information on the reason behind this, read [webpack 4: import() and CommonJs](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655)
 
-Note the use of `webpackChunkName` in the comment. This will cause our separate bundle to be named `lodash.bundle.js` instead of just `[id].bundle.js`. For more information on `webpackChunkName` and the other available options, see the [`import()` documentation](/api/module-methods#import-1). Let's run webpack to see `lodash` separated out to a separate bundle:
+Note the use of `webpackChunkName` in the comment. This will cause our separate bundle to be named `lodash.bundle.js` instead of just `[id].bundle.js`. For more information on `webpackChunkName` and the other available options, see the [`import()` documentation](/api/module-methods/#import-1). Let's run webpack to see `lodash` separated out to a separate bundle:
 
 ``` bash
 ...
diff --git a/src/content/guides/getting-started.md b/src/content/guides/getting-started.md
@@ -27,7 +27,7 @@ webpack is used to compile JavaScript modules. Once [installed](/guides/installa
 
 ## Basic Setup
 
-First let's create a directory, initialize npm, [install webpack locally](/guides/installation#local-installation), and install the webpack-cli (the tool used to run webpack on the command line):
+First let's create a directory, initialize npm, [install webpack locally](/guides/installation/#local-installation), and install the webpack-cli (the tool used to run webpack on the command line):
 
 ``` bash
 mkdir webpack-demo
diff --git a/src/content/guides/hot-module-replacement.md b/src/content/guides/hot-module-replacement.md
@@ -162,7 +162,7 @@ server.listen(5000, 'localhost', () => {
 });
 ```
 
-T> If you're [using `webpack-dev-middleware`](/guides/development#using-webpack-dev-middleware), check out the [`webpack-hot-middleware`](https://github.com/webpack-contrib/webpack-hot-middleware) package to enable HMR on your custom dev server.
+T> If you're [using `webpack-dev-middleware`](/guides/development/#using-webpack-dev-middleware), check out the [`webpack-hot-middleware`](https://github.com/webpack-contrib/webpack-hot-middleware) package to enable HMR on your custom dev server.
 
 
 ## Gotchas
diff --git a/src/content/guides/lazy-loading.md b/src/content/guides/lazy-loading.md
@@ -20,9 +20,9 @@ Lazy, or "on demand", loading is a great way to optimize your site or applicatio
 
 ## Example
 
-Let's take the example from [Code Splitting](/guides/code-splitting#dynamic-imports) and tweak it a bit to demonstrate this concept even more. The code there does cause a separate chunk, `lodash.bundle.js`, to be generated and technically "lazy-loads" it as soon as the script is run. The trouble is that no user interaction is required to load the bundle -- meaning that every time the page is loaded, the request will fire. This doesn't help us too much and will impact performance negatively.
+Let's take the example from [Code Splitting](/guides/code-splitting/#dynamic-imports) and tweak it a bit to demonstrate this concept even more. The code there does cause a separate chunk, `lodash.bundle.js`, to be generated and technically "lazy-loads" it as soon as the script is run. The trouble is that no user interaction is required to load the bundle -- meaning that every time the page is loaded, the request will fire. This doesn't help us too much and will impact performance negatively.
 
-Let's try something different. We'll add an interaction to log some text to the console when the user clicks a button. However, we'll wait to load that code (`print.js`) until the interaction occurs for the first time. To do this we'll go back and rework the [final _Dynamic Imports_ example](/guides/code-splitting#dynamic-imports) from _Code Splitting_ and leave `lodash` in the main chunk.
+Let's try something different. We'll add an interaction to log some text to the console when the user clicks a button. However, we'll wait to load that code (`print.js`) until the interaction occurs for the first time. To do this we'll go back and rework the [final _Dynamic Imports_ example](/guides/code-splitting/#dynamic-imports) from _Code Splitting_ and leave `lodash` in the main chunk.
 
 __project__
 
diff --git a/src/content/guides/progressive-web-application.md b/src/content/guides/progressive-web-application.md
@@ -36,7 +36,7 @@ __package.json__
 }
 ```
 
-Note: [webpack DevServer](/configuration/dev-server/) writes in-memory by default. We'll need to enable [writeToDisk](/configuration/dev-server#devserverwritetodisk-) option in order for http-server to be able to serve files from `./dist` directory.
+Note: [webpack DevServer](/configuration/dev-server/) writes in-memory by default. We'll need to enable [writeToDisk](/configuration/dev-server/#devserverwritetodisk-) option in order for http-server to be able to serve files from `./dist` directory.
 
 If you haven't previously done so, run the command `npm run build` to build your project. Then run the command `npm start`. This should produce the following output:
 
diff --git a/src/content/loaders/index.md b/src/content/loaders/index.md
@@ -11,7 +11,7 @@ contributors:
 
 webpack enables use of [loaders](/concepts/loaders) to preprocess files. This allows you to bundle any static resource way beyond JavaScript. You can easily write your own loaders using Node.js.
 
-Loaders are activated by using `loadername!` prefixes in `require()` statements, or are automatically applied via regex from your webpack configuration – see [configuration](/concepts/loaders#configuration).
+Loaders are activated by using `loadername!` prefixes in `require()` statements, or are automatically applied via regex from your webpack configuration – see [configuration](/concepts/loaders/#configuration).
 
 
 ## Files
diff --git a/src/content/migrate/3.md b/src/content/migrate/3.md
@@ -89,7 +89,7 @@ The new naming conventions are easier to understand and are a good reason to upg
 
 ## Chaining loaders
 
-Like in webpack 1, loaders can be chained to pass results from loader to loader. Using the [rule.use](/configuration/module#ruleuse)
+Like in webpack 1, loaders can be chained to pass results from loader to loader. Using the [rule.use](/configuration/module/#ruleuse)
  configuration option, `use` can be set to an array of loaders.
 In webpack 1, loaders were commonly chained with `!`. This style is only supported using the legacy option `module.loaders`.
 
@@ -455,15 +455,15 @@ To keep compatibility with old loaders, loaders can be switched to debug mode vi
 
 ## Code Splitting with ES2015
 
-In webpack 1, you could use [`require.ensure()`](/api/module-methods#requireensure) as a method to lazily-load chunks for your application:
+In webpack 1, you could use [`require.ensure()`](/api/module-methods/#requireensure) as a method to lazily-load chunks for your application:
 
 ```javascript
 require.ensure([], function(require) {
   var foo = require('./module');
 });
 ```
 
-The ES2015 Loader spec defines [`import()`](/api/module-methods#import-1) as method to load ES2015 Modules dynamically on runtime. webpack treats `import()` as a split-point and puts the requested module in a separate chunk. `import()` takes the module name as argument and returns a Promise.
+The ES2015 Loader spec defines [`import()`](/api/module-methods/#import-1) as method to load ES2015 Modules dynamically on runtime. webpack treats `import()` as a split-point and puts the requested module in a separate chunk. `import()` takes the module name as argument and returns a Promise.
 
 ```js
 function onClick() {
