top of page
Logo der Online Agentur mdwp


DevDependencies in React JS refers to the packages or modules that are necessary only in the development environment and not required when the application is in production mode. These are tools, libraries, or frameworks that assist in the development process but aren't needed for the app itself to run.

For example, testing libraries, ESLint, Babel, Webpack, etc., are all usually included as devDependencies. They provide certain features in the development process, like linting, transpiling ES6 code to ES5, or bundling the code, but these features aren't needed for the final deployed application.

You can add devDependencies to your React app using npm or yarn package managers.

Using npm:
npm install --save-dev package-name

Using yarn:
yarn add --dev package-name

Here `package-name` is the name of the package you want to add as a devDependency. Once added, this package will be listed in your `package.json` file under `devDependencies`.

A sample `package.json` file:

"name": "my-react-app",
"version": "1.0.0",
"description": "A react app",
"main": "index.js",
"dependencies": {
"react": "^16.8.6",
"react-dom": "^16.8.6"
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"webpack": "^4.38.0",
"webpack-cli": "^3.3.7"
"scripts": {
"start": "webpack --mode development",
"build": "webpack --mode production"
In this example, `babel-core, babel-loader, webpack, webpack-cli` are devDependencies, important for development and build processes, but not for the application to run.

bottom of page