@achmadk/vite-plugin-react-remove-devtools
π¦ Table of Contents
π Description
Hey there!
@achmadk/vite-plugin-react-remove-devtools
is this cool Vite plugin that lets us keep the React DevTools indicator hidden, even when using the React library to build our web app. Pretty neat, huh?
Just a quick heads up - this plugin is specifically designed for Vite and not for Rollup. Here's why:
- The plugin is called with the
pre
enforce value. - It's activated only when you use the
vite build
command.
Hope this helps! π
Prerequisites
Before we get started, make sure you have these essentials ready:
- The most recent LTS version of Node (v18)
π - If you're using a package manager other than
npm
, grab the latest version of your favorite one (yarn
,pnpm
)π¦ - Don't forget to install the newest version of Vite (v4)
β‘
Happy coding!
π§ Installation
Just type this command like this
npm i @achmadk/vite-plugin-react-remove-devtools # npm
yarn add @achmadk/vite-plugin-react-remove-devtools # yarn
pnpm add @achmadk/vite-plugin-react-remove-devtools # pnpm
into your favorite CLI, and you'll be all set.
π² Usages
Let's go ahead and add removeReactDevtools
method from @achmadk/vite-plugin-react-remove-devtools
to your Vite config. It's super easy!
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react' // or import react from '@vitejs/plugin-react-swc'
import { removeReactDevtools } from '@achmadk/vite-plugin-react-remove-devtools'
export default defineConfig({
plugins: [
removeReactDevtools(),
react()
]
})
Just so you know, the removeReactDevtools
method has an option with the same name, removeReactDevtools
, which is set to true
by default. If you'd like, you can change its value to false
.
export default defineConfig({
plugins: [
- removeReactDevtools(),
+ removeReactDevtools({ removeReactDevtools: false }),
react()
]
})
π‘ Inspirations
Hey there! I just wanted to give a big thumbs up to the fantastic vite-preset-react plugin by Puru Vijay. I borrowed the source code for the remove react devtools feature from it to create this plugin. π By the way, I accidentally included Puru's MIT license in the LICENSE file instead of mine. My bad!