feat: withDevTools disabled in prod - tree-shaking docs

README.md

@@ -76,6 +76,52 @@ patchState(this.store, {loading: false});
 updateState(this.store 'update loading', {loading: false});
 ```
 
+`withDevtools()` is by default enabled in production mode, if you want to tree-shake it from the application bundle you need to abstract it in your environment file.
+
+<details>
+
+  <summary>Devtools tree-shaking details</summary>
+
+  environment.ts:
+```typescript
+import { withDevtools } from '@angular-architects/ngrx-toolkit';
+
+export const environment = {
+  storeWithDevTools: withDevtools
+}
+```
+
+environment.prod.ts
+```typescript
+import { withDevtoolsStub } from '@angular-architects/ngrx-toolkit';
+
+export const environment = {
+  storeWithDevTools: withDevToolsStub
+}
+```
+
+Then all you need to do is replace `withDevTools` everywhere in your app with `environment.storeWithDevTools`
+e.g.:
+```typescript
+export const SomeStore = signalStore(
+  withState({strings: [] as string[] }),
+  environment.storeWithDevTools('featureName')
+);
+```
+
+Also make sure you have defined file replacements in angular.json prod configuration:
+```json
+"fileReplacements": [
+  {
+    "replace": "src/environments/environment.ts",
+    "with": "src/environments/environment.prod.ts"
+  }
+]
+```
+
+</details>
+
+
 ## Redux: `withRedux()`
 
 `withRedux()` bring back the Redux pattern into the Signal Store.

libs/ngrx-toolkit/src/index.ts

@@ -1,4 +1,5 @@
 export {
+  withDevToolsStub,
   withDevtools,
   patchState,
   updateState,

libs/ngrx-toolkit/src/lib/with-devtools.ts

@@ -79,6 +79,11 @@ export function reset() {
   storeRegistry.set({});
 }
 
+/**
+ * Stub for DevTools integration. Can be used to disable DevTools in production.
+ */
+export const withDevToolsStub: typeof withDevtools = () => store => store;
+
 /**
  * @param name store's name as it should appear in the DevTools
  */