Disable chrome react DevTools for production Disable chrome react DevTools for production google-chrome google-chrome

Disable chrome react DevTools for production


According to an issue on Github, you can add run a single javascript line before react is loaded to prevent it.

From #191 of react-devtools

<script>window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function () {}</script>

Then, you may consider wrapping this with your environment condition, like that you could do sth like below in your server side rendering. Let's say Pug (formerly known as Jade):

#{process.env.NODE_ENV == 'production' ? "window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function(){}" : ""}

However, it would be still a good practice to put the business logic and the sensitive data back to your server.


If you are using redux-devtools-extension you can do this.

const devTools =  process.env.NODE_ENV === "production"    ? applyMiddleware(...middlewares)    : composeWithDevTools(applyMiddleware(...middlewares));const store = createStore(rootReducer, initialState, devTools);

This will make sure your devtools extension only works in the development environment and not in the production environment


Just improve @peteriod answer, to make sure Dev tool has installed or not

if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === 'object') {   __REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function() {};}