@ ngrx / store-devtools for production mode

Question

I am using @ ngrx / store-devtools with the Chrome extension.

Does it make sense to disable it for production mode?

Answer 1

You can simply not import it into yours NgModulewhen you are in working mode by doing something like this:

import { StoreDevtoolsModule } from '@ngrx/store-devtools';

let dev = [
  StoreDevtoolsModule.instrumentOnlyWithExtension()
];
if (environment.production) {
  dev = [];
  enableProdMode();
}

@NgModule({
  imports: [
    StoreModule.provideStore(rootReducer),
    ...dev
  ]
})
export class AppModule {}

Answer 2

The original accepted answer leaves store-devtools code in the production assembly, although it is never used.

To completely remove store-devtools from the production assembly and save the package size while doing this:

Create a folder src/app/build-specifics

Create index.ts file

import { StoreDevtoolsModule } from '@ngrx/store-devtools';
export buildSpecificModules = [StoreDevtoolsModule.instrument({maxAge: 25})];

Create file index.prod.ts

export buildSpecificModules = [];

angular.json Replacements. src/app/build-specics/index.ts index.prod.ts, store-devtools .

"production": {
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": false,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true,
    "serviceWorker": true,
    "ngswConfigPath": "src/ngsw-config.json",
    "fileReplacements": [
        {
            "replace": "src/environments/environment.ts",
            "with": "src/environments/environment.prod.ts"
        },
        {
            "replace": "src/app/build-specifics/index.ts",
            "with": "src/app/build-specifics/index.prod.ts"
        }
    ]
}

app.module.ts , , angular.json fileReplacements .

import { buildSpecificModules } from './build-specifics';

@NgModule({
  imports: [
    StoreModule.provideStore(rootReducer),
    ...buildSpecificModules
  ]
})
export class AppModule {}