From b0778068e65739449e630713c92a15e3b6cd6ceb Mon Sep 17 00:00:00 2001
From: EV <mail@enricovogt.de>
Date: Sun, 18 Aug 2019 01:03:52 +0200
Subject: [PATCH] docs(store-devtools): add recipe to exclude store-devtools
 from the build

Closes #1521
---
 .../guide/store-devtools/recipes/exclude.md   | 53 +++++++++++++++++++
 projects/ngrx.io/content/navigation.json      |  9 ++++
 2 files changed, 62 insertions(+)
 create mode 100644 projects/ngrx.io/content/guide/store-devtools/recipes/exclude.md

diff --git a/projects/ngrx.io/content/guide/store-devtools/recipes/exclude.md b/projects/ngrx.io/content/guide/store-devtools/recipes/exclude.md
new file mode 100644
index 0000000000..a4409ccb46
--- /dev/null
+++ b/projects/ngrx.io/content/guide/store-devtools/recipes/exclude.md
@@ -0,0 +1,53 @@
+# Excluding Store Devtools from a production build
+
+To prevent Store Devtools from being included in your bundle, you can exclude it from the build process.
+
+
+## Step 1: Create build specific files
+
+Create a folder for your build specific files. In this case, it is `build-specifics`. Now create a file for a common build. Within this file, export an array that defines the `StoreDevtoolsModule`.
+
+<code-example header="build-specifics/index.ts">
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+
+export const extModules = [
+    StoreDevtoolsModule.instrument({
+        maxAge: 25
+    })
+];
+</code-example>
+
+Now create a file for a production build (`ng build --prod=true`) that simply exports an empty array.
+
+<code-example header="build-specifics/index.prod.ts">
+export const extModules = [];
+</code-example>
+
+## Step 2: Import extModules
+
+Modify `app.module.ts` to include `extModules` in the `imports` array.
+
+<code-example header="app.module.ts">
+import { extModules } from './build-specifics';
+
+@NgModule({
+    imports: [
+        StoreModule.forRoot(reducers),
+        // Instrumentation must be imported after importing StoreModule
+        ...extModules,
+    ],
+})
+</code-example>
+
+## Step 3: Modify angular.json
+
+Add a new entry in the `fileReplacements` section in your `angular.json`. For more information on this topic, look at the build section of the angular documentation. [Configure target-specific file replacements](https://angular.io/guide/build#configure-target-specific-file-replacements)
+
+<code-example header="angular.json">
+"fileReplacements": [
+    {
+        "replace": "src/app/build-specifics/index.ts",
+        "with": "src/app/build-specifics/index.prod.ts"
+    }
+]
+</code-example>
\ No newline at end of file
diff --git a/projects/ngrx.io/content/navigation.json b/projects/ngrx.io/content/navigation.json
index fa45d29112..4cee49fc64 100644
--- a/projects/ngrx.io/content/navigation.json
+++ b/projects/ngrx.io/content/navigation.json
@@ -148,6 +148,15 @@
         {
           "title": "Instrumentation",
           "url": "guide/store-devtools/config"
+        },
+        {
+          "title": "Recipes",
+          "children": [
+            {
+              "title": "Excluding from the build",
+              "url": "guide/store-devtools/recipes/exclude"
+            }
+          ]
         }
       ]
     },